<template>
  <div class="deviceAll">
    <div class="content">
      <!-- 区域 -->
      <div class="area">
        <el-card shadow="never" class="box-card">
          <div slot="header" class="clearfix">
            <!-- <span>区域选择</span>
            <span>分组选择</span> -->
            <el-tabs v-model="fz_qy_activeName" @tab-click="fz_qy_handleClick">
              <el-tab-pane label="区域选择" name="first"></el-tab-pane>
              <el-tab-pane label="分组选择" name="second"></el-tab-pane>
            </el-tabs>
          </div>
          <div v-if="fz_qy_activeName == 'first'">
            <el-input
              placeholder="输入关键字进行过滤"
              clearable
              v-model="filterText"
            >
            </el-input>
            <div class="areaContent">
              <el-tree
                ref="tree"
                :expand-on-click-node="false"
                :highlight-current="true"
                default-expand-all
                :data="treeData"
                :props="defaultProps"
                @node-click="handleNodeClick"
                :filter-node-method="filterNode"
              >
                <template slot-scope="{ node }">
                  <span
                    style="font-size: 14px"
                    class="custom-tree-node"
                    :title="node.label"
                    >{{ node.label }}</span
                  >
                  <!-- <span>{{ node }}</span> -->
                </template>
              </el-tree>
            </div>
          </div>
          <div v-if="fz_qy_activeName == 'second'">
            <el-input
              placeholder="输入关键字进行过滤"
              clearable
              v-model="filterText1"
              @input="inputFn"
            >
            </el-input>
            <div class="areaContent">
              <el-tree
                ref="tree1"
                :props="defaultProps1"
                :highlight-current="true"
                :data="meterTitleList1"
                @node-click="handleNodeClick"
              >
                <span
                  style="font-size: 14px;"
                  class="custom-tree-node"
                  slot-scope="{ node, data }"
                >
                  {{ data.groupName }}
                </span>
              </el-tree>
            </div>
          </div>
          <!-- <el-input
   
            placeholder="输入关键字进行过滤1"
            clearable
            v-model="filterText1"
          >
          </el-input> -->
          <!-- treeData -->
        </el-card>
      </div>
      <div class="device">
        <el-tabs v-model="activeName" @tab-click="handleClick">
          <div class="number">
            <div class="item">
              <div class="top" style="display: flex; align-items: center">
                <div class="dot" style="margin-right: 5px"></div>
                <div class="nam">
                  {{ meterType == 1 ? "电表" : "水表" }}总数
                </div>
              </div>
              <div class="bottom" style="font-size: 2rem; font-weight: bold">
                {{ deviceCount }}
              </div>
            </div>
            <div class="item">
              <div class="top" style="display: flex; align-items: center">
                <div
                  class="dot"
                  style="
                    width: 10px;
                    height: 10px;
                    background: red;
                    border-radius: 50%;
                    margin-right: 5px;
                  "
                ></div>
                <div class="nam">
                  {{ meterType == 1 ? "拉闸总数" : "关阀总数" }}
                </div>
              </div>
              <div class="bottom" style="font-size: 2rem; font-weight: bold">
                {{ deviceOffCount }}
              </div>
            </div>
            <div class="item">
              <div class="top" style="display: flex; align-items: center">
                <div
                  class="dot"
                  style="
                    width: 10px;
                    height: 10px;
                    background: springgreen;
                    border-radius: 50%;
                    margin-right: 5px;
                  "
                ></div>
                <div class="nam">
                  {{ meterType == 1 ? "合闸总数" : "开阀总数" }}
                </div>
              </div>
              <div class="bottom" style="font-size: 2rem; font-weight: bold">
                {{ deviceOnCount }}
              </div>
            </div>
            <div class="item">
              <div class="top" style="display: flex">
                <div class="dot"></div>
                <div class="nam">
                  剩余{{ meterType == 1 ? "电" : "水" }}量(总)
                </div>
              </div>
              <div class="bottom" style="font-size: 2rem; font-weight: bold">
                {{ deviceRemainCount }}
              </div>
            </div>
            <div class="item">
              <div class="top" style="display: flex">
                <div class="dot"></div>
                <div class="nam">
                  使用{{ meterType == 1 ? "电" : "水" }}量(总)
                </div>
              </div>
              <div class="bottom" style="font-size: 2rem; font-weight: bold">
                {{ deviceUseCount }}
              </div>
            </div>
          </div>
          <!-- 搜索框 -->
          <div class="search">
            <el-input
              placeholder="请输入设备名称/表号"
              clearable
              prefix-icon="el-icon-search"
              v-model="searchMeterName"
            >
            </el-input>
            <el-button
              type="success"
              :disabled="ids.length == 0 ? true : false"
              icon="el-icon-coin"
              @click="singleMorePriceDialogShow = true"
              >批量修改单价</el-button
            >
            <el-button
              type="primary"
              @click="changeAreaShow = true"
              :disabled="ids.length == 0 ? true : false"
              >更换区域</el-button
            >
            <el-tooltip
              class="item"
              effect="dark"
              content="点击该按钮  批量充值 / 清零 / 拉合闸任务"
              placement="top-start"
            >
              <el-button type="info" @click="piLiang">批量操作列表</el-button>
            </el-tooltip>

            <el-button type="primary" @click="export_excel">导出</el-button>

            <el-select
              clearable
              @clear="sortType = null"
              v-model="sortType"
              placeholder="请选择排序方法"
            >
              <el-option
                v-for="item in sortList"
                :key="item.value"
                :label="item.sortName"
                :value="item.sortType"
              >
              </el-option>
            </el-select>
            <el-button type="primary" icon="el-icon-search" @click="search"
              >搜索</el-button
            >
          </div>
          <!-- 内容 -->
          <el-tab-pane
            :label="item.label"
            :name="item.name"
            v-for="(item, index) in titleList"
            :key="index"
          >
            <!-- 表格数据 -->
            <div class="table">
              <el-table
                :show-overflow-tooltip="true"
                :data="tableData"
                ref="isExpand"
                height="calc(100%-10rem)"
                v-loading="loading"
                border
                highlight-current-row
                stripe
                style="width: 100%"
                @selection-change="handleSelectionChange"
              >
                <template slot="empty">
                  <el-empty description="暂无数据"></el-empty>
                </template>
                <el-table-column type="selection" width="55"> </el-table-column>
                <el-table-column
                  width="150"
                  align="center"
                  prop="meterName"
                  label="名称"
                >
                  <template slot-scope="scope">
                    <el-popover
                      placement="top"
                      trigger="hover"
                      :content="scope.row.meterName"
                    >
                      <span slot="reference" class="twoLineCls">{{
                        scope.row.meterName
                      }}</span>
                    </el-popover>
                  </template>
                </el-table-column>
                <el-table-column
                  width="150"
                  align="center"
                  prop="meterModel"
                  label="设备类型"
                >
                  <template slot-scope="scope">
                    <el-tag type="success">{{ scope.row.meterModel }}</el-tag>
                    <!-- <el-tag type="success" v-if="scope.row.meterModelId == 2">蓝牙电表</el-tag>
                    <el-tag type="success" v-if="scope.row.meterModelId == 3">4G倍率表</el-tag>
                    <el-tag type="success" v-if="scope.row.meterModelId == 4">蓝牙倍率电表</el-tag>
                    <el-tag v-if="scope.row.meterModelId == 5">4G水表</el-tag>
                    <el-tag v-if="scope.row.meterModelId == 6">蓝牙水表</el-tag> -->
                  </template>
                </el-table-column>

                <el-table-column
                  width="150"
                  align="center"
                  prop="meterNumber"
                  label="表号"
                >
                  <template slot-scope="scope">
                    {{ scope.row.meterNumber }}
                  </template>
                </el-table-column>

                <el-table-column
                  width="150"
                  align="center"
                  prop="online"
                  label="状态"
                >
                  <template slot-scope="scope">
                    <el-tag
                      type="success"
                      v-if="
                        scope.row.online == true &&
                          (scope.row.meterModelId == 1 ||
                            scope.row.meterModelId == 3 ||
                            scope.row.meterModelId == 5 ||
                            scope.row.meterModelId == 8 ||
                            scope.row.meterModelId == 7)
                      "
                      >在线</el-tag
                    >
                    <el-tag
                      type="danger"
                      v-if="
                        scope.row.online == false &&
                          (scope.row.meterModelId == 1 ||
                            scope.row.meterModelId == 3 ||
                            scope.row.meterModelId == 5 ||
                            scope.row.meterModelId == 8 ||
                            scope.row.meterModelId == 7)
                      "
                      >离线</el-tag
                    >
                    <el-tag
                      v-if="
                        (scope.row.meterModelId == 2 &&
                          scope.row.averPid == null) ||
                          scope.row.meterModelId == 4 ||
                          scope.row.meterModelId == 6
                      "
                      >暂无</el-tag
                    >
                    <el-tag
                      v-if="scope.row.meterModelId == 2 && scope.row.averPid"
                      >子表</el-tag
                    >
                  </template>
                </el-table-column>
                <el-table-column
                  width="150"
                  align="center"
                  prop="meterUseCount"
                  :label="meterType == 1 ? '用电量(度)' : '用水量(m³)'"
                >
                </el-table-column>
                <el-table-column
                  width="200"
                  align="center"
                  prop="yesterdayUse"
                  :label="meterType == 1 ? '昨日用电量(度)' : '昨日用水量(m³)'"
                >
                </el-table-column>
                <el-table-column
                  width="150"
                  align="center"
                  prop="meterSurplusCount"
                  :label="meterType == 1 ? '剩余电量(度)' : '剩余水量(m³)'"
                >
                </el-table-column>
                <el-table-column
                  width="150"
                  align="center"
                  prop="meterSinglePrice"
                  :label="meterType == 1 ? '单价(元/度)' : '单价(元/m³)'"
                >
                </el-table-column>
                <el-table-column
                  width="150"
                  align="center"
                  prop="meterAddress"
                  label="设备地址"
                >
                  <template slot-scope="scope">
                    <el-popover
                      placement="top"
                      trigger="hover"
                      :content="scope.row.meterAddress"
                    >
                      <span slot="reference" class="twoLineCls">{{
                        scope.row.meterAddress
                      }}</span>
                    </el-popover>
                  </template>
                </el-table-column>
                <el-table-column
                  width="200"
                  align="center"
                  prop="meterReadingTime"
                  label="抄表时间"
                >
                  <template slot-scope="scope">
                    <el-popover
                      placement="top"
                      trigger="hover"
                      :content="
                        scope.row.meterReadingTime
                          ? scope.row.meterReadingTime
                          : '暂无'
                      "
                    >
                      <span slot="reference" class="twoLineCls">{{
                        scope.row.meterReadingTime
                          ? scope.row.meterReadingTime
                          : "暂无"
                      }}</span>
                    </el-popover>
                  </template>
                </el-table-column>
                <el-table-column
                  width="150"
                  align="center"
                  prop="isForbid"
                  label="是否禁用"
                >
                  <template slot-scope="scope">
                    <el-switch
                      v-model="scope.row.isForbid"
                      active-color="#13ce66"
                      inactive-color="#DCDFE6"
                      @change="switchItem2(scope.row)"
                    >
                    </el-switch>
                  </template>
                </el-table-column>
                <el-table-column
                  width="150"
                  align="center"
                  prop="meterStatus"
                  :label="meterType == 1 ? '强制拉合闸' : '强制开关阀'"
                >
                  <template slot-scope="scope">
                    <el-switch
                      v-model="scope.row.meterStatus"
                      active-color="#13ce66"
                      inactive-color="#DCDFE6"
                      @change="switchItem(scope.row)"
                      :disabled="
                        (scope.row.meterModelId == 2 &&
                          scope.row.averPid == null) ||
                        scope.row.meterModelId == 4 ||
                        scope.row.meterModelId == 6 ||
                        ((scope.row.meterModelId == 1 ||
                          scope.row.meterModelId == 3 ||
                          scope.row.meterModelId == 5 ||
                          scope.row.meterModelId == 7 ||
                          scope.row.meterModelId == 8) &&
                          scope.row.online == false)
                          ? true
                          : false
                      "
                    >
                    </el-switch>
                  </template>
                </el-table-column>
                <el-table-column
                  width="150"
                  fixed="right"
                  align="center"
                  label="操作"
                >
                  <template slot-scope="scope">
                    <el-button
                      @click="copy(scope.row.meterId)"
                      :disabled="
                        (scope.row.meterModelId == 2 &&
                          scope.row.averPid == null) ||
                        scope.row.meterModelId == 4 ||
                        scope.row.meterModelId == 6 ||
                        ((scope.row.meterModelId == 1 ||
                          scope.row.meterModelId == 3 ||
                          scope.row.meterModelId == 5 ||
                          scope.row.meterModelId == 7 ||
                          scope.row.meterModelId == 8) &&
                          scope.row.online == false)
                          ? true
                          : false
                      "
                      size="mini"
                      type="success"
                      >抄表</el-button
                    >
                    <el-dropdown trigger="click">
                      <el-button size="mini" type="primary">更多</el-button>
                      <el-dropdown-menu slot="dropdown">
                        <el-dropdown-item @click.native="openEdit(scope.row)"
                          >编辑</el-dropdown-item
                        >
                        <el-dropdown-item
                          @click.native="openSinglePrice(scope.row)"
                          >单价</el-dropdown-item
                        >
                        <el-dropdown-item
                          @click.native="openDetail(scope.row.meterId)"
                          >详情</el-dropdown-item
                        >
                        <el-dropdown-item
                          @click.native="ded(scope.row)"
                          v-if="
                            scope.row.meterModelId != 5 &&
                              scope.row.meterModelId != 6
                          "
                          :disabled="
                            (scope.row.meterModelId == 2 &&
                              scope.row.averPid == null) ||
                            scope.row.meterModelId == 4 ||
                            scope.row.meterModelId == 6 ||
                            ((scope.row.meterModelId == 1 ||
                              scope.row.meterModelId == 3 ||
                              scope.row.meterModelId == 5 ||
                              scope.row.meterModelId == 7 ||
                              scope.row.meterModelId == 8) &&
                              scope.row.online == false)
                              ? true
                              : false
                          "
                          >抵消金额</el-dropdown-item
                        >
                        <!-- 电表 -->
                        <el-dropdown-item
                          v-if="meterType==1"
                          :disabled="
                            (scope.row.meterModelId == 2 &&
                              scope.row.averPid == null) ||
                            scope.row.meterModelId == 4 ||
                            scope.row.meterModelId == 6 ||
                            ((scope.row.meterModelId == 1 ||
                              scope.row.meterModelId == 3 ||
                              scope.row.meterModelId == 5 ||
                              scope.row.meterModelId == 7 ||
                              scope.row.meterModelId == 8) &&
                              scope.row.online == false)
                              ? true
                              : false
                          "
                          @click.native="openCharge(scope.row)"
                          >管理员充值</el-dropdown-item
                        >
                        <!-- 水表 -->
                        <el-dropdown-item
                         v-if="meterType==2"
                          :disabled="
                            (scope.row.meterModelId == 2 &&
                              scope.row.averPid == null) ||
                            scope.row.meterModelId == 4 ||
                            // scope.row.meterModelId == 6 ||
                            (scope.row.meterModelId == 1 ||
                              scope.row.meterModelId == 3)  // scope.row.meterModelId == 5 || // scope.row.meterModelId == 7 || // scope.row.meterModelId == 8) // && scope.row.online == false
                              ? true
                              : false
                          "
                          @click.native="openCharge(scope.row)"
                          >管理员充值</el-dropdown-item
                        >
                        <el-dropdown-item
                          @click.native="clear(scope.row.meterId)"
                          :disabled="
                            (scope.row.meterModelId == 2 &&
                              scope.row.averPid == null) ||
                            scope.row.meterModelId == 4 ||
                            scope.row.meterModelId == 6 ||
                            ((scope.row.meterModelId == 1 ||
                              scope.row.meterModelId == 3 ||
                              scope.row.meterModelId == 5 ||
                              scope.row.meterModelId == 7 ||
                              scope.row.meterModelId == 8) &&
                              scope.row.online == false)
                              ? true
                              : false
                          "
                          >清零</el-dropdown-item
                        >
                        <el-dropdown-item
                          :disabled="
                            (scope.row.meterModelId == 2 &&
                              scope.row.averPid == null) ||
                            scope.row.meterModelId == 4 ||
                            scope.row.meterModelId == 6 ||
                            ((scope.row.meterModelId == 1 ||
                              scope.row.meterModelId == 3 ||
                              scope.row.meterModelId == 5 ||
                              scope.row.meterModelId == 7 ||
                              scope.row.meterModelId == 8) &&
                              scope.row.online == false)
                              ? true
                              : false
                          "
                          @click.native="off(scope.row)"
                          >强制拉闸</el-dropdown-item
                        >
                        <el-dropdown-item
                          v-if="
                            scope.row.meterModelId != 5 &&
                              scope.row.meterModelId != 6
                          "
                          @click.native="openDedRecord(scope.row)"
                          >抵消记录</el-dropdown-item
                        >
                        <el-dropdown-item
                          @click.native="openCaliRecord(scope.row)"
                          v-if="
                            scope.row.meterModelId == 5 ||
                              scope.row.meterModelId == 6
                          "
                          >校准记录</el-dropdown-item
                        >
                        <el-dropdown-item
                          @click.native="openWaterMeterTask(scope.row)"
                          v-if="
                            scope.row.meterModelId == 5 ||
                              scope.row.meterModelId == 6
                          "
                          >水表任务</el-dropdown-item
                        >
                        <el-dropdown-item
                          @click.native="openClearRecord(scope.row)"
                          >清零记录</el-dropdown-item
                        >
                        <el-dropdown-item
                          @click.native="openChargeRecord(scope.row)"
                          >充值记录</el-dropdown-item
                        >
                        <el-dropdown-item
                          @click.native="openCopyRecord(scope.row)"
                          >抄表记录</el-dropdown-item
                        >
                        <el-dropdown-item @click.native="openArea(scope.row)"
                          >修改区域</el-dropdown-item
                        >
                        <el-dropdown-item @click.native="del(scope.row)"
                          >删除</el-dropdown-item
                        >
                        <!-- 获取二维码详情 -->
                        <el-dropdown-item @click.native="qrCode(scope.row)"
                          >二维码</el-dropdown-item
                        >
                        <!-- 自定义排序 -->
                        <el-dropdown-item @click.native="setSort(scope.row)"
                          >自定义排序</el-dropdown-item
                        >
                      </el-dropdown-menu>
                    </el-dropdown>
                  </template>
                </el-table-column>
              </el-table>
              <!-- 分页 -->
              <el-pagination
                v-show="tableData.length !== 0"
                background
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="pageNum"
                :page-sizes="[10, 30, 50, 70, 100]"
                :page-size="pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total"
              >
              </el-pagination>
            </div>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
    <!-- 管理员充值 -->
    <div class="dialogPay">
      <el-dialog
        title="管理员充值"
        :visible.sync="chargeDialogShow"
        width="40%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
        @close="closeDialogPay"
      >
        <el-form :model="meterInfo" label-width="100px" class="demo-ruleForm">
          <el-form-item label="设备名称">
            <el-input v-model="meterInfo.meterName" disabled></el-input>
          </el-form-item>
          <el-form-item label="设备表号">
            <el-input v-model="meterInfo.meterNumber" disabled></el-input>
          </el-form-item>
          <el-form-item label="设备单价">
            <el-input v-model="meterInfo.meterSinglePrice" disabled>
              <template slot="append"
                >元/度</template
              >
            </el-input>
          </el-form-item>
          <el-form-item label="倍率">
            <el-input v-model="meterInfo.chargeTimes" disabled> </el-input>
          </el-form-item>
          <el-form-item label="充值金额">
            <div class="box">
              <div
                class="item"
                @click="select(index)"
                :class="{ select: item.select == true }"
                v-for="(item, index) in moneyList"
                :key="index"
              >
                {{ item.num }}元
              </div>
              <el-input
                type="number"
                @focus="focus"
                @input="input"
                v-model="inputPrice"
                clearable
                placeholder="自定义金额"
              >
                <template slot="append"
                  >元</template
                >
              </el-input>
            </div>
          </el-form-item>
          <el-form-item label="到账电量">
            <el-input v-model="meterInfo.meter" disabled>
              <template slot="append"
                >度</template
              >
            </el-input>
          </el-form-item>
        </el-form>

        <span slot="footer" class="dialog-footer">
          <el-button @click="chargeDialogShow = false">取 消</el-button>
          <el-button
            :disabled="canPay == false && (money || inputPrice) ? false : true"
            type="primary"
            @click="pay"
            >立即充值</el-button
          >
        </span>
      </el-dialog>
    </div>
    <!-- 单价 -->
    <div class="dialogSetPice">
      <el-dialog
        title="设置单价"
        :visible.sync="singlePriceDialogShow"
        width="30%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <el-form :model="singleForm" label-width="50px" class="demo-ruleForm">
          <el-form-item label="单价" prop="singlePrice">
            <el-input
              type="number"
              v-model="singleForm.singlePrice"
              clearable
              placeholder="请输入单价"
            ></el-input>
          </el-form-item>
        </el-form>

        <span slot="footer" class="dialog-footer">
          <el-button @click="singlePriceDialogShow = false">取 消</el-button>
          <el-button type="primary" @click="setPrice">确 认</el-button>
        </span>
      </el-dialog>
    </div>
    <!-- 批量修改单价 -->
    <div class="dialogMoreSetPice">
      <el-dialog
        title="批量设置单价"
        :visible.sync="singleMorePriceDialogShow"
        width="30%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <el-form :model="singleForm1" label-width="50px" class="demo-ruleForm">
          <el-form-item label="单价" prop="singlePrice">
            <el-input
              type="number"
              v-model="singleForm1.singlePrice"
              clearable
              placeholder="请输入单价"
            ></el-input>
          </el-form-item>
        </el-form>

        <span slot="footer" class="dialog-footer">
          <el-button @click="singleMorePriceDialogShow = false"
            >取 消</el-button
          >
          <el-button type="primary" @click="setMorePrice">确 认</el-button>
        </span>
      </el-dialog>
    </div>
    <!--详情 -->
    <div class="dialogDetail">
      <el-dialog
        title="详细数据"
        :visible.sync="infoDialogVisible"
        width="80%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <div class="one">
          <div class="left">
            <div class="title">基础信息</div>
            <div class="content_one">
              <tr>
                <td style="width: 30%">
                  <span class="tdTitle">设备名称</span>
                  <el-popover
                    width="180"
                    placement="top"
                    trigger="hover"
                    :content="meterName"
                  >
                    <span slot="reference" class="twoLineCls">{{
                      meterName
                    }}</span>
                  </el-popover>
                </td>
                <td style="width: 40%">
                  <span class="tdTitle">设备地址</span>
                  <el-popover
                    width="180"
                    placement="top"
                    trigger="hover"
                    :content="meterAddress"
                  >
                    <span slot="reference" class="twoLineCls">{{
                      meterAddress
                    }}</span>
                  </el-popover>
                </td>
                <td style="width: 30%">
                  <span class="tdTitle">设备型号</span>
                  <span>{{ meterModel }}</span>
                </td>
              </tr>
              <tr>
                <td style="width: 30%">
                  <span class="tdTitle">表号</span>
                  <span>{{ meterNumber }}</span>
                </td>
                <td style="width: 40%">
                  <span class="tdTitle">IMEI</span>
                  <el-popover
                    width="180"
                    placement="top"
                    trigger="hover"
                    :content="imei ? imei : '暂无'"
                  >
                    <span slot="reference" class="twoLineCls">{{
                      imei ? imei : "暂无"
                    }}</span>
                  </el-popover>
                </td>
                <td style="width: 30%">
                  <span class="tdTitle" style="width: 50px">ICCID</span>
                  <el-popover
                    width="200"
                    placement="top"
                    trigger="hover"
                    :content="iccid ? iccid : '暂无'"
                  >
                    <span slot="reference" class="twoLineCls">{{
                      iccid ? iccid : "暂无"
                    }}</span>
                  </el-popover>
                </td>
              </tr>
              <tr>
                <td style="width: 30%">
                  <span class="tdTitle">互感倍数</span>
                  <span>{{ chargeTimes ? chargeTimes : "1" }}</span>
                </td>
                <td style="width: 40%" v-if="meterType == 1">
                  <span class="tdTitle">电压</span>
                  <span>{{ voltage ? voltage + "(V)" : "暂无" }}</span>
                </td>
                <td style="width: 30%" v-if="meterType == 1">
                  <span class="tdTitle">电流</span>
                  <span>{{ ampere ? ampere + "(A)" : "暂无" }}</span>
                </td>
                <td style="width: 30%" v-if="meterType == 2">
                  <span class="tdTitle">电量</span>
                  <span>{{ batLow ? "低电量" : "正常" }}</span>
                </td>
              </tr>
            </div>
          </div>
          <div class="left">
            <div class="title">功能计费信息</div>
            <div class="content_one">
              <tr style="justify-content: space-around">
                <td>
                  <span class="tdTitle"
                    >剩余{{ meterType == 1 ? "电" : "水" }}量</span
                  >
                  <span>{{ meterSurplusCount }}</span>
                </td>
                <td>
                  <span class="tdTitle"
                    >{{ meterType == 1 ? "电" : "水" }}表状态</span
                  >
                  <span style="color: red" v-if="meterStatus == 0">
                    {{ meterType == 1 ? "拉闸" : "关阀" }}
                  </span>
                  <span style="color: #1aa034" v-else>
                    {{ meterType == 1 ? "合闸" : "开阀" }}
                  </span>
                </td>
              </tr>
              <tr style="justify-content: space-around">
                <td>
                  <span class="tdTitle"
                    >总用{{ meterType == 1 ? "电" : "水" }}量</span
                  >
                  <span>{{ meterUseCount }}</span>
                </td>
                <td>
                  <span class="tdTitle">付款方式</span>
                  <span>{{
                    $store.getters.payWay == 1 ? "线上充值" : "线下充值"
                  }}</span>
                </td>
              </tr>
              <tr style="justify-content: space-around">
                <td>
                  <span class="tdTitle"
                    >{{ meterType == 1 ? "电" : "水" }}量单价</span
                  >
                  <span
                    >{{ meterSinglePrice }}元/{{
                      meterType == 1 ? "度" : "m³"
                    }}</span
                  >
                </td>
                <td>
                  <span class="tdTitle" style="width: 70px">抄表时间</span>
                  <el-popover
                    width="200"
                    placement="top"
                    trigger="hover"
                    :content="meterReadingTime ? meterReadingTime : '未抄表'"
                  >
                    <span slot="reference" class="twoLineCls">{{
                      meterReadingTime ? meterReadingTime : "未抄表"
                    }}</span>
                  </el-popover>
                </td>
              </tr>
            </div>
          </div>
        </div>
        <div class="two" style="width: 100%">
          <div
            class="title"
            style="
              padding: 5px 10px;
              border-left: 5px solid #278bff;
              color: #278bff;
              margin: 20px;
            "
          >
            用{{ meterType == 1 ? "电" : "水" }}量数据分析
          </div>
          <div class="data" style="width: 100%">
            <div
              class="top"
              style="
                display: flex;
                justify-content: space-between;
                padding: 0 30px;
                align-items: center;
              "
            >
              <div class="left" style="display: flex; align-items: center">
                总用{{ meterType == 1 ? "电" : "水" }}量
                <span
                  style="font-weight: bold; font-size: 30px; margin-left: 5px"
                  >{{ amount }}</span
                >
              </div>
              <div class="right" style="display: flex; align-items: center">
                <el-button
                  type="primary"
                  @click="out"
                  style="margin-right: 10px"
                  >导出</el-button
                >
                <el-radio-group
                  style="margin-right: 10px"
                  @input="dateChange"
                  v-model="timeData.dateOperation"
                >
                  <el-radio-button label="year">年</el-radio-button>
                  <el-radio-button label="month">月</el-radio-button>
                </el-radio-group>
                <el-date-picker
                  v-model="timeData.date"
                  :type="timeData.dateOperation == 'year' ? 'year' : 'month'"
                  clearable
                  value-format="yyyy-MM-dd"
                  placeholder="选择日期"
                  @change="dateChange"
                >
                </el-date-picker>
              </div>
            </div>
            <div id="line" ref="line" style="width: 100%; height: 300px"></div>
          </div>
        </div>
      </el-dialog>
    </div>
    <!--充值记录 -->
    <div class="dialog">
      <el-dialog
        ref="detail"
        :title="chargeTitle"
        :visible.sync="chargeRecordDialogVisible"
        width="80%"
        :close-on-click-modal="false"
        :destroy-on-close="true"
      >
        <div class="chargeSearch" style="display: flex; margin-bottom: 20px">
          <div class="chargeType" style="margin-right: 20px">
            充值类型：
            <el-select
              @change="chargeChange"
              v-model="chargeType"
              placeholder="请选择充值类型"
            >
              <el-option
                v-for="item in chargeTypeList"
                :key="item.id"
                :label="item.label"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </div>
          <div class="chargeTime">
            时间：
            <el-date-picker
              :clearable="false"
              @change="chargeTimeChange"
              v-model="chargeTime"
              format="yyyy 年 MM 月"
              value-format="yyyy-MM"
              type="month"
              placeholder="选择日期"
            >
            </el-date-picker>
          </div>
        </div>
        <div class="table">
          <el-table
            :data="chargeData"
            ref="charge"
            v-loading="chargeLoading"
            border
            key="1"
            highlight-current-row
            stripe
            style="width: 100%"
            height="450px"
          >
            <template slot="empty">
              <el-empty description="暂无数据"></el-empty>
            </template>
            <el-table-column align="center" prop="rechargeOrder" label="订单号">
            </el-table-column>
            <el-table-column
              align="center"
              prop="beforeCount"
              label="充值前度数"
            >
            </el-table-column>
            <el-table-column
              align="center"
              prop="basicRechargeAmount"
              label="充值金额"
            >
              <template slot-scope="scope">
                <el-tag> {{ scope.row.basicRechargeAmount }}</el-tag>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              prop="afterCount"
              label="充值后度数"
            >
            </el-table-column>
            <el-table-column align="center" prop="process" label="充值状态">
              <template slot-scope="scope">
                <el-tag type="danger" v-if="scope.row.process == -1"
                  >失败</el-tag
                >
                <el-tag type="warning" v-if="scope.row.process == 0"
                  >处理中...</el-tag
                >
                <el-tag type="warning" v-if="scope.row.process == 1"
                  >待充电...</el-tag
                >
                <el-tag type="success" v-if="scope.row.process == 2"
                  >成功</el-tag
                >
              </template>
            </el-table-column>
            <el-table-column align="center" prop="rechargeWay" label="充值方式">
              <template slot-scope="scope">
                <el-tag type="warning" v-if="scope.row.rechargeWay == 1"
                  >现金充值</el-tag
                >
                <el-tag type="warning" v-if="scope.row.rechargeWay == 2"
                  >租币充值</el-tag
                >
                <el-tag type="success" v-if="scope.row.rechargeWay == 3"
                  >微信充值</el-tag
                >
                <el-tag v-if="scope.row.rechargeWay == 4">支付宝充值</el-tag>
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              prop="rechargeTime"
              label="充值时间"
            >
            </el-table-column>
          </el-table>
          <el-pagination
            v-show="chargeData.length !== 0"
            background
            @size-change="handleSizeChangeCharge"
            @current-change="handleCurrentChangeCharge"
            :current-page="pageNumCharge"
            :page-sizes="[10, 30, 50, 70, 100]"
            :page-size="pageSizeCharge"
            layout="total, sizes, prev, pager, next, jumper"
            :total="chargeTotal"
          >
          </el-pagination>
        </div>
      </el-dialog>
    </div>
    <!-- 抄表记录 -->
    <div class="dialog">
      <el-dialog
        ref="detail"
        :title="copyTitle"
        :visible.sync="copyRecordDialogVisible"
        width="80%"
        :close-on-click-modal="false"
        :destroy-on-close="true"
      >
        <div class="chargeSearch" style="display: flex; margin-bottom: 20px">
          <div class="chargeTime">
            时间：
            <el-date-picker
              :clearable="false"
              @change="copyChange"
              v-model="copyTime"
              value-format="yyyy-MM"
              type="month"
              placeholder="选择日期"
            >
            </el-date-picker>
          </div>
        </div>
        <div class="table">
          <el-table
            :data="copyData"
            ref="copyData"
            v-loading="copyLoading"
            border
            highlight-current-row
            stripe
            style="width: 100%"
            height="450px"
          >
            <template slot="empty">
              <el-empty description="暂无数据"></el-empty>
            </template>
            <el-table-column
              align="center"
              prop="elecUseCount"
              label="总用电量"
            >
            </el-table-column>
            <el-table-column
              align="center"
              prop="elecSurplusCount"
              label="剩余电量"
            >
            </el-table-column>
            <el-table-column align="center" prop="readingTime" label="抄表时间">
            </el-table-column>
          </el-table>
          <el-pagination
            v-show="copyData.length !== 0"
            background
            @size-change="handleSizeChangeCopy"
            @current-change="handleCurrentChangeCopy"
            :current-page="pageNumCopy"
            :page-sizes="[10, 30, 50, 70, 100]"
            :page-size="pageSizeCopy"
            layout="total, sizes, prev, pager, next, jumper"
            :total="copyTotal"
          >
          </el-pagination>
        </div>
      </el-dialog>
    </div>
    <!-- 清零记录 -->
    <div class="dialog">
      <el-dialog
        ref="detail"
        :title="clearTitle"
        :visible.sync="clearRecordDialogVisible"
        width="80%"
        :close-on-click-modal="false"
        :destroy-on-close="true"
      >
        <div class="chargeSearch" style="display: flex; margin-bottom: 20px">
          <div class="chargeTime">
            时间：
            <el-date-picker
              :clearable="false"
              @change="clearChange"
              v-model="clearTime"
              value-format="yyyy-MM"
              type="month"
              placeholder="选择日期"
            >
            </el-date-picker>
          </div>
        </div>
        <div class="table">
          <el-table
            :data="clearData"
            ref="clearData"
            v-loading="clearLoading"
            border
            highlight-current-row
            stripe
            style="width: 100%"
            height="450px"
          >
            <template slot="empty">
              <el-empty description="暂无数据"></el-empty>
            </template>
            <el-table-column
              align="center"
              prop="elecUseCount"
              label="总用电量"
            >
            </el-table-column>
            <el-table-column
              align="center"
              prop="elecSurplusCount"
              label="剩余电量"
            >
            </el-table-column>
            <el-table-column align="center" prop="clearTime" label="清零时间">
            </el-table-column>
          </el-table>
          <el-pagination
            v-show="clearData.length !== 0"
            background
            @size-change="handleSizeChangeClear"
            @current-change="handleCurrentChangeClear"
            :current-page="pageNumClear"
            :page-sizes="[10, 30, 50, 70, 100]"
            :page-size="pageSizeClear"
            layout="total,sizes,prev,pager,next,jumper"
            :total="clearTotal"
          >
          </el-pagination>
        </div>
      </el-dialog>
    </div>
    <!-- 校准记录 -->
    <div class="dialog">
      <el-dialog
        ref="detail"
        :title="caliTitle"
        :visible.sync="caliRecordDialogVisible"
        width="80%"
        :close-on-click-modal="false"
        :destroy-on-close="true"
      >
        <div class="chargeSearch" style="display: flex; margin-bottom: 20px">
          <div class="chargeTime">
            时间：
            <el-date-picker
              :clearable="false"
              @change="caliChange"
              v-model="caliTime"
              value-format="yyyy-MM"
              type="month"
              placeholder="选择日期"
            >
            </el-date-picker>
          </div>
        </div>
        <div class="table">
          <el-table
            :data="caliData"
            ref="clearData"
            v-loading="caliLoading"
            border
            highlight-current-row
            stripe
            style="width: 100%"
            height="450px"
          >
            <template slot="empty">
              <el-empty description="暂无数据"></el-empty>
            </template>
            <el-table-column align="center" prop="useLogId" label="id">
            </el-table-column>
            <el-table-column align="center" prop="use" label="校准水量">
            </el-table-column>
            <el-table-column align="center" prop="createTime" label="校准时间">
            </el-table-column>
          </el-table>
          <el-pagination
            v-show="caliData.length !== 0"
            background
            @size-change="handleSizeChangeCali"
            @current-change="handleCurrentChangeCali"
            :current-page="pageNumCali"
            :page-sizes="[10, 30, 50, 70, 100]"
            :page-size="pageSizeCali"
            layout="total,sizes,prev,pager,next,jumper"
            :total="caliTotal"
          >
          </el-pagination>
        </div>
      </el-dialog>
    </div>
    <!-- 抵消记录 -->
    <div class="dialog">
      <el-dialog
        ref="detail"
        :title="dedTitle"
        :visible.sync="dedDialog22"
        width="80%"
        :close-on-click-modal="false"
        :destroy-on-close="true"
      >
        <div class="chargeSearch" style="display: flex; margin-bottom: 20px">
          <div class="chargeTime">
            时间：
            <el-date-picker
              :clearable="false"
              @change="dedChange"
              v-model="dedTime"
              value-format="yyyy-MM"
              type="month"
              placeholder="选择日期"
            >
            </el-date-picker>
          </div>
        </div>
        <div class="table">
          <el-table
            :data="dedData"
            ref="dedData"
            v-loading="dedLoading"
            border
            highlight-current-row
            stripe
            style="width: 100%"
            height="450px"
          >
            <template slot="empty">
              <el-empty description="暂无数据"></el-empty>
            </template>
            <el-table-column align="center" prop="minusLogId" label="id">
            </el-table-column>
            <el-table-column align="center" prop="minusMoney" label="抵消金额">
            </el-table-column>
            <el-table-column align="center" prop="createTime" label="操作时间">
            </el-table-column>
          </el-table>
          <el-pagination
            v-show="dedData.length !== 0"
            background
            @size-change="handleSizeChangeDed"
            @current-change="handleCurrentChangeDed"
            :current-page="pageNumDed"
            :page-sizes="[10, 30, 50, 70, 100]"
            :page-size="pageSizeDed"
            layout="total,sizes,prev,pager,next,jumper"
            :total="dedTotal"
          >
          </el-pagination>
        </div>
      </el-dialog>
    </div>
    <!-- 修改区域 -->
    <div class="changeAreaShowDialog">
      <el-dialog
        title="修改区域"
        :visible.sync="changeAreaShow"
        width="30%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <el-cascader
          :props="prop"
          v-model="changeArea"
          :options="treeData1"
          @change="handleChange"
        ></el-cascader>
        <span slot="footer" class="dialog-footer">
          <el-button @click="changeAreaShow = false">取 消</el-button>
          <el-button
            type="primary"
            :disabled="changeArea ? false : true"
            @click="editArea"
            >确 认</el-button
          >
        </span>
      </el-dialog>
    </div>
    <div class="changeAreaShowDialog">
      <el-dialog
        title="修改区域"
        :visible.sync="changeAreaShow1"
        width="30%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <el-cascader
          :props="prop"
          v-model="changeArea1"
          :options="treeData1"
          @change="handleChange"
        ></el-cascader>
        <span slot="footer" class="dialog-footer">
          <el-button @click="changeAreaShow1 = false">取 消</el-button>
          <el-button
            type="primary"
            :disabled="changeArea1 ? false : true"
            @click="editArea1"
            >确 认</el-button
          >
        </span>
      </el-dialog>
    </div>
    <!-- 编辑 -->
    <div class="deviceDialog">
      <el-dialog
        title="编辑"
        :visible.sync="deviceDialogShow"
        width="30%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <el-form :model="deviceForm" label-width="120px" class="demo-ruleForm">
          <el-form-item label="设备名称">
            <el-input
              v-model="deviceForm.name"
              clearable
              placeholder="请输入设备名称"
            ></el-input>
          </el-form-item>
          <el-form-item label="设备地址">
            <el-input
              v-model="deviceForm.address"
              clearable
              placeholder="请输入设备地址"
            ></el-input>
          </el-form-item>
        </el-form>

        <span slot="footer" class="dialog-footer">
          <el-button @click="deviceDialogShow = false">取 消</el-button>
          <el-button
            type="primary"
            :disabled="deviceForm.address && deviceForm.name ? false : true"
            @click="edit"
            >确 认</el-button
          >
        </span>
      </el-dialog>
    </div>
    <!-- 抵消金额 -->
    <div class="deviceDialog">
      <el-dialog
        title="抵消金额"
        :visible.sync="dedDialog"
        width="30%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <el-form :model="deviceForm" label-width="100px" class="demo-ruleForm">
          <el-form-item label="抵消金额">
            <el-input
              v-model="dedNum"
              clearable
              placeholder="请输入抵消金额"
            ></el-input>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button
            @click="
              dedDialog = false;
              dedNum = '';
            "
            >取 消</el-button
          >
          <el-button
            type="primary"
            :disabled="dedNum ? false : true"
            @click="addDed"
            >确 认</el-button
          >
        </span>
      </el-dialog>
    </div>
    <!-- 查看设备二维码 -->
    <div class="dialogEqCode">
      <el-dialog
        :title="eqCodeObject.meterName"
        :visible.sync="eqDialogShow"
        width="13%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <!-- 内容展示区 -->
        <div class="qrcode_content" style="margin-left: 30px;">
          <div class="qrcode" ref="qrCodeUrl"></div>
          <div style="font-weight: bold; color: #000;margin-top: 5px;">
            {{ eqCodeObject.meterNumber }}
          </div>
        </div>
        <!-- 
        <span slot="footer" class="dialog-footer">
          <el-button @click="eqDialogShow = false">取 消</el-button>
          <el-button type="primary" @click="eqDialogShow = false"
            >确 认</el-button
          >
        </span> -->
      </el-dialog>
    </div>
    <!-- 水表任务-->
    <div class="WaterMeterTask">
      <el-dialog
        :title="WaterMeterTaskTitle"
        :visible.sync="WaterMeterTaskShow"
        width="28%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <!-- 内容展示区 -->
        <div class="WaterMeterTaskTitle_content">
          <el-tabs
            v-model="WaterMeterTaskActive"
            @tab-click="WaterMeterTask_handleClick"
          >
            <el-tab-pane label="拉合闸" name="first"> </el-tab-pane>

            <el-tab-pane label="清零" name="second"> </el-tab-pane>
          </el-tabs>

          <el-form
            v-if="WaterMeterTaskActive == 'first'"
            label-width="160px"
            style="width: 100%;"
          >
            <el-row style="width: 100%;">
              <el-form-item label="是否执行拉合闸任务：">
                <el-switch
                  @change="changeState(1, $event)"
                  v-model="WaterMeterTaskForm.isCarryTask"
                  active-color="#13ce66"
                >
                </el-switch>
              </el-form-item>
            </el-row>

            <el-row>
              <el-form-item label="阀门开关：">
                <el-switch
                  @change="changeState(2, $event)"
                  v-model="WaterMeterTaskForm.isValve"
                  active-color="#13ce66"
                >
                </el-switch>
              </el-form-item>
            </el-row>
            <el-row style="margin-top: 25px; ">
              <el-col
                style="text-align: right; color:#606266;font-weight: 800;"
                :span="9"
                >设置时间：</el-col
              >
              <el-col
                style="text-align: right;color: #606266 ;font-weight: 800"
                :span="15"
                >{{
                  WaterMeterTaskForm.setTime ? WaterMeterTaskForm.setTime : ""
                }}</el-col
              >
            </el-row>
            <el-row
              style="margin-top: 50px;
;"
            >
              <el-col
                style="text-align: right; color: #606266 ;font-weight: 800"
                :span="9"
                >完成时间：</el-col
              >
              <el-col
                style="text-align: right;color: #606266 ;font-weight: 800"
                :span="15"
              >
                {{
                  WaterMeterTaskForm.completeTime
                    ? WaterMeterTaskForm.completeTime
                    : ""
                }}</el-col
              >
            </el-row>
          </el-form>

          <el-form
            v-if="WaterMeterTaskActive == 'second'"
            ref="form"
            label-width="160px"
            style="width: 100%;"
          >
            <el-row style="width: 100%;">
              <el-form-item label="是否执行清零任务：">
                <el-switch
                  @change="changeState(3, $event)"
                  v-model="WaterMeterTaskForm1.isReset"
                  active-color="#13ce66"
                >
                </el-switch>
              </el-form-item>
            </el-row>
            <el-row style="margin-top: 25px; ">
              <el-col
                style="text-align: right; color:#606266;font-weight: 800;"
                :span="9"
                >设置时间：</el-col
              >
              <el-col
                style="text-align: right;color: #606266 ;font-weight: 800"
                :span="15"
                >{{
                  WaterMeterTaskForm1.setTime ? WaterMeterTaskForm1.setTime : ""
                }}</el-col
              >
            </el-row>
            <el-row style="margin-top: 50px; ">
              <el-col
                style="text-align: right; color:#606266;font-weight: 800;"
                :span="9"
                >完成时间：</el-col
              >
              <el-col
                style="text-align: right;color: #606266 ;font-weight: 800"
                :span="15"
                >{{
                  WaterMeterTaskForm1.completeTime
                    ? WaterMeterTaskForm1.completeTime
                    : ""
                }}</el-col
              >
            </el-row>
          </el-form>
        </div>
      </el-dialog>
    </div>

    <!--批量（目前暂时 支持 清零  充值）       可充值的在线列表-->

    <div class="dialogBatchRecharge" v-if="BatchRechargeListShow">
      <el-dialog
        :title="oprationTitle"
        :visible.sync="BatchRechargeListShow"
        width="50%"
        style="height: 100%;"
        :show-close="false"
        :close-on-click-modal="false"
        :destroy-on-close="true"
      >
        <!-- 内容展示区 -->
        <div class="BatchRecharge_content" style="margin-bottom: 20px;">
          <div style="margin-bottom: 20px;">
            <el-select
            v-if="meterType == 2 && batchFlag == 0"
            v-model="clearSwitch"
            placeholder="请选择是否立即执行水表清零任务"
          >
            <el-option
              v-for="item in clearSwitchoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <el-select
            v-if="meterType == 1 && batchFlag == 2"
            v-model="control"
            placeholder=""
          >
            <el-option
              v-for="item in controloptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <el-select
            v-if="meterType == 2 && batchFlag == 2"
            v-model="controlSwitch"
            placeholder=""
          >
            <el-option
              v-for="item in controlSwitchoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          <el-select
            v-if="meterType == 2 && batchFlag == 2"
            v-model="controlType"
            placeholder=""
          >
            <el-option
              v-for="item in controlTypeoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
          </div>
  
          <!-- 表格区域 -->
          <!-- 表格数据    tableData   替换成定义的表格数据变量 rechargeTableData-->
           <div style="display: flex;">
    <!-- 左侧区域分组展示 -->
           <!-- 区域 -->
           <div class="area" style="width: 200px;margin-right: 20px;">
        <el-card shadow="never" class="box-card" style="height: 500px;">
          <div slot="header" class="clearfix">
            <!-- <span>区域选择</span>
            <span>分组选择</span> -->
            <el-tabs v-model="fz_qy_activeName1" @tab-click="fz_qy_handleClick1">
              <el-tab-pane label="区域" name="first1"></el-tab-pane>
              <el-tab-pane label="分组" name="second1"></el-tab-pane>
            </el-tabs>
          </div>
          <keep-alive>
            <div v-if="fz_qy_activeName1 == 'first1'">
            <div class="areaContent">
              <el-tree
                ref="batTree"
                :expand-on-click-node="false"
                :highlight-current="true"
                default-expand-all
                :data="batchData"
                :props="defaultProps"
                @node-click="handleNodeClick1"
               
              >
                <template slot-scope="{ node }">
                  <span
                    style="font-size: 14px"
                    class="custom-tree-node"
                    :title="node.label"
                    >{{ node.label }}</span
                  >
                  <!-- <span>{{ node }}</span> -->
                </template>
              </el-tree>
            </div>
          </div>
          </keep-alive>
 
          <keep-alive>
            <div v-if="fz_qy_activeName1 == 'second1'">
            <!-- <el-input
              placeholder="输入关键字进行过滤哈"
              clearable
              v-model="filterText1"
              @input="inputFn"
            >
            </el-input> -->
            <div style="height: 380px;overflow-y: auto;">
              <el-tree
                ref="batTree1"
                :props="defaultProps1"
                :highlight-current="true"
                :data="meterTitleList2"
                @node-click="handleNodeClick1"
              >
                <span
                  style="font-size: 14px;"
                  class="custom-tree-node"
                  slot-scope="{ node, data }"
                >
                  {{ data.groupName }}
                </span>
              </el-tree>
            </div>
          </div>
          </keep-alive>
      
          <!-- <el-input
   
            placeholder="输入关键字进行过滤1"
            clearable
            v-model="filterText1"
          >
          </el-input> -->
          <!-- treeData -->
        </el-card>
      </div>
            <div class="table" style="flex: 1;">
            <el-table
              :show-overflow-tooltip="true"
              :data="rechargeTableData"
              ref="isExpand"
              height="500"
              v-loading="loading"
              border
              highlight-current-row
              stripe
              style="width: 100%"
              @selection-change="handleSelectionChange1"
            >
              <template slot="empty">
                <el-empty description="暂无数据"></el-empty>
              </template>
              <el-table-column type="selection" width="55"> </el-table-column>
              <el-table-column align="center" prop="meterName" label="仪表名称">
                <template slot-scope="scope">
                  <el-popover
                    placement="top"
                    trigger="hover"
                    :content="scope.row.meterName"
                  >
                    <span slot="reference" class="twoLineCls">{{
                      scope.row.meterName
                    }}</span>
                  </el-popover>
                </template>
              </el-table-column>

              <el-table-column align="center" prop="meterNumber" label="表号">
                <template slot-scope="scope">
                  {{ scope.row.meterNumber }}
                </template>
              </el-table-column>
              <el-table-column align="center" prop="flag" label="批量操作结果">
                <template slot-scope="scope">
                  <span v-if="scope.row.flag == null">暂无数据</span>
                  <span v-if="scope.row.flag == 0">失败</span>
                  <span v-if="scope.row.flag == 1">成功</span>
                  <!-- {{
                    scope.row.flag == null
                      ? "暂无"
                      : scope.row.flag == 0
                      ? "失败"
                      : "成功"
                  }} -->
                </template>
              </el-table-column>
            </el-table>
            <!-- 分页 -->
            <el-pagination
              v-show="tableData.length !== 0"
              background
              @size-change="handleSizeChange1"
              @current-change="handleCurrentChange1"
              :current-page="pageNum1"
              :page-sizes="[3, 5, 10]"
              :page-size="pageSize1"
              layout="total, sizes, prev, pager, next, jumper"
              :total="total1"
            >
            </el-pagination>
          </div>
           </div>
       
        </div>
<!-- fz_qy_activeName1='first1 -->
        <span slot="footer" class="dialog-footer">
          <div style="margin-bottom: 20px;">{{ ResultInFo }}</div>
          <el-button @click="close_BatchRechargeList">取 消</el-button>
          <el-button
            v-if="batchFlag == 0 && meterType == 1"
            :disabled="bachIds.length == 0 ? true : false"
            type="primary"
            @click="confirm_BatchRechargelist"
            >确认批量清零</el-button
          >
          <el-button
            v-if="batchFlag == 0 && meterType == 2"
            :disabled="
              bachIds.length == 0 || clearSwitch == null ? true : false
            "
            type="primary"
            @click="confirm_BatchRechargelist"
            >确认批量清零</el-button
          >

          <el-button
            v-if="batchFlag == 1"
            :disabled="bachIds.length == 0 ? true : false"
            type="primary"
            @click="confirm_BatchRechargelist"
            >确认批量充值</el-button
          >
          <el-button
            v-if="batchFlag == 2 && meterType == 1"
            :disabled="bachIds.length == 0 ? true : false"
            type="primary"
            @click="confirm_BatchRechargelist"
            >确认批量{{ control == false ? "合闸" : "拉闸" }}</el-button
          >
          <el-button
            v-if="batchFlag == 2 && meterType == 2"
            :disabled="bachIds.length == 0 ? true : false"
            type="primary"
            @click="confirm_BatchRechargelist"
            >确认批量{{ control == false ? "开闸" : "关闸" }}</el-button
          >
        </span>
      </el-dialog>
    </div>

    <!--批量充值  -->
    <div style="height: 300px !important;" class="dialogBatchRecharge">
      <el-dialog
        v-loading="loading"
        ref="reCharege"
        title="批量充值"
        :visible.sync="BatchRechargeShow"
        width="30%"
        @close="close_BatchRecharge"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <!-- 内容展示区 -->
        <div class="BatchRecharge_content">
          <el-form
            ref="BatchRechargeForm"
            :rules="rules"
            :model="BatchRechargeForm"
            label-width="80px"
          >
            <el-form-item label="充值金额" prop="money">
              <el-input
                validate-event
                v-model="BatchRechargeForm.money"
                placeholder="请输入充值金额"
              ></el-input>
            </el-form-item>
          </el-form>
        </div>

        <span slot="footer" class="dialog-footer">
          <el-button @click="close_BatchRecharge">取 消</el-button>
          <el-button type="primary" @click="confirm_BatchRecharge"
            >确 认</el-button
          >
        </span>
      </el-dialog>
    </div>

    <!-- 自定义排序 -->
    <div class="sort">
      <el-dialog
        title="设置自定义排序"
        :visible.sync="sortDialogShow"
        width="15%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <!-- 内容展示区 -->
        <div class="qrcode_content">
          <el-form
            :model="sortForm"
            :rules="rules"
            ref="sortForm"
            label-width="100px"
            class="demo-ruleForm"
          >
            <el-form-item label="排序位置" prop="sortValue">
              <el-input v-model="sortForm.sortValue"></el-input>
            </el-form-item>
          </el-form>
        </div>

        <span slot="footer" class="dialog-footer">
          <el-button @click="sortDialogShow = false">取 消</el-button>
          <el-button type="primary" @click="sort_confirm">确 认</el-button>
        </span>
      </el-dialog>
    </div>
    <!-- 批量弹框 -->

    <div class="sort">
      <el-dialog
        title="批量操作"
        :visible.sync="piliang_show"
        width="35%"
        :close-on-click-modal="true"
        :destroy-on-close="true"
      >
        <!-- 内容展示区 -->
        <div class="qrcode_content">
          <el-button type="success" @click="batchOperation(0)"
            >批量清零</el-button
          >
          <el-button type="warning" @click="batchOperation(1)"
            >批量充值</el-button
          >
          <el-button
            v-if="meterType == 1"
            type="info"
            @click="batchOperation(2)"
            >批量拉合闸</el-button
          >
          <el-button
            v-if="meterType == 2"
            type="info"
            @click="batchOperation(2)"
            >批量水表任务</el-button
          >
          <!-- <el-button type="info" @click="reset">重置</el-button> -->
        </div>

        <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="piliang_show = false,fz_qy_activeName1='first1'"
            >关闭</el-button
          >
        </span>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import { error } from "jquery";
import {
  getDeviceApi,
  controlApi,
  getChargeRecordApi,
  getOneMeterApi,
  getChargeTypeApi,
  getTimeAnalysisApi,
  setPriceApi,
  setMorePriceApi,
  getCopyRecordApi,
  copyApi,
  delApi,
  payApi,
  clearApi,
  clearRecordApi,
  checkApi,
  editMeterApi,
  getDeviceNumApi,
  editOrzApi,
  OneOutApi,
  payAgainApi,
  postIsForbidApi,
  dedApi,
  dedRecordApi,
  caliRecordApi,
  deviceManagementExportApi,
  setWaterApi,
  setWaterClearApi,
  getWaterApi,
  getWaterclearApi,
  setSortOrder,
  getwaterOffClearList,
  getMeterClearMultiDeviceList,
  setMeterClearMulti,
  setWaterOffClear,
  getPayMultiDeviceList,
  setPayMulti,
  getControlMultiDeviceList,
  setMeterControlMulti,
  getWaterOffMultiDeviceList,
  setWaterOffControl
} from "../../api/devive";
import { getGroupApi } from "@/api/group";
import { getOrzApi } from "../../api/orz";
import QRCode from "qrcodejs2";
import { Result } from "element-ui";

export default {
  watch: {
    filterText(val) {
      console.log("区域", val);

      this.$refs.tree.filter(val);
    }

    // 监听路由变化
    //     '$route.query':{
    //       handler:function(newVal) {
    //         // 处理参数变化的逻辑
    //         console.log('监听路由变化',newVal,typeof(newVal));
    //         // 判断如果值为空对象则不是其他页面跳转过来，是正常模块切换，反之是页面跳转
    // const flag=Object.keys(newVal)
    // // 页面跳转
    // if(flag.length>0) {
    // // 调用设备类型    设备分页的方法
    // //
    // console.log('变化了');
    // this.meterType=newVal.meterType
    // this.search()

    // }else {
    //   // 暂无操作
    // }
    //       },
    //       immediate:true,deep:true
    //     }
  },
  data() {
    return {
      dedTime: "",
      dedData: [],
      pageNumDed: 1,
      pageSizeDed: 10,
      dedTotal: null,
      dedLoading: false,
      dedDialog22: false,
      dedTitle: "",
      prop: {
        children: "children",
        label: "orzName",
        value: "orzId",
        checkStrictly: true
      },
      treeData1: [],
      options: "",
      changeArea: "",
      changeArea1: "",
      changeAreaShow: false,
      changeAreaShow1: false,
      deviceCount: "0",
      deviceOffCount: "0",
      deviceOnCount: "0",
      deviceRemainCount: "0",
      deviceUseCount: "0",
      treeData: [],
      batchData: [],// 批量操作左侧区域数据
      filterText: "",
      filterText1: "",
      // 区域配置
      defaultProps: {
        children: "children",
        label: "orzName"
      },
      // 分组配置
      defaultProps1: {
        id: "groupId",
        children: "children",
        label: "groupName"
      },
      deviceForm: {
        name: "",
        address: ""
      },
      deviceDialogShow: false,
      value: 0,
      meterType: 1,
      groupId: "",
      groupId1: "", // 批量 分组id 
      modelId: "1",
      meterModelId: "",
      activeName: "1", // 电表水表切换后状态值
      fz_qy_activeName: "first", // 区域选择、分组选择切换后绑定的状态值
      fz_qy_activeName1: "first1", // 区域选择、分组选择切换后绑定的状态值
      visible: false,
      online: "",
      pageNum: 1, // 第几页
      pageSize: 10, // 页数
      total: null,
      searchMeterName: "", // 搜索名称、表号
      loading: false,
      tableData: [],
      // 清零记录----------------------------------
      clearTitle: "",
      clearRecordDialogVisible: false,
      clearTime: "",
      pageNumClear: 1,
      pageSizeClear: 10,
      clearLoading: false,
      clearTotal: null,
      clearData: [],
      // 清零记录----------------------------------
      // 设置单价----------------------------------
      singlePriceDialogShow: false,
      singleForm: {
        singlePrice: ""
      },
      singleForm1: {
        singlePrice: ""
      },
      ids: [],
      singleMorePriceDialogShow: false,
      // 设置单价----------------------------------
      // 充值记录--------------------------------------
      chargeRecordDialogVisible: false, // 充值记录弹出框
      chargeType: "", //充值类型
      chargeTypeList: [
        {
          label: "全部类型",
          id: ""
        },
        {
          label: "现金充值",
          id: 1
        },
        {
          label: "租币充值",
          id: 2
        },
        {
          label: "微信支付",
          id: 3
        },
        {
          label: "支付宝支付",
          id: 4
        }
      ], //充值类型list
      chargeTime: "", //充值记录时间
      chargeData: [], //充值记录数据
      chargeLoading: false,
      chargeTotal: null,
      chargeTitle: "",
      pageNumCharge: 1,
      pageSizeCharge: 10,
      // 充值记录--------------------------------------
      // 抄表记录--------------------------------------
      copyData: [],
      copyTitle: "",
      copyLoading: false,
      copyTotal: null,
      copyTime: "",
      copyRecordDialogVisible: false,
      pageNumCopy: 1,
      pageSizeCopy: 10,
      // 抄表记录--------------------------------------
      // 详情--------------------------------------
      infoDialogVisible: false, //详情弹出框
      meterName: "", //设备名称
      meterAddress: "", //设备地址
      meterModel: "", //设备型号
      meterNumber: "", //表号
      imei: "",
      batLow: 0,
      iccid: "",
      meterUseCount: "", //总用电量
      meterSurplusCount: "", //剩余电量
      meterStatus: "", //拉合闸
      meterSinglePrice: "", //单价
      meterReadingTime: "", //抄表时间
      chargeTimes: "", //倍率
      voltage: "", //电压
      ampere: "", //电流
      payWay: "",
      canPay: true,
      timeData: {
        date: "",
        dateOperation: "year"
      },
      optionData: [],
      searyData: [],
      amount: "",
      detailLoading: null,
      // 详情--------------------------------------
      // 管理员充值---------------------------------------------------
      meterInfo: {
        meterName: "",
        meterNumber: "",
        meterSinglePrice: "",
        meter: "0",
        chargeTimes: 1
      },
      inputPrice: "",
      chargeDialogShow: false,
      moneyList: [
        {
          num: "100",
          select: true
        },
        {
          num: "300",
          select: false
        },
        {
          num: "500",
          select: false
        },
        {
          num: "1000",
          select: false
        }
      ],
      money: 100,
      // 管理员充值---------------------------------------------------
      meterId: "",
      titleList: [
        {
          label: "电表",
          name: "1",
          groupId: ""
        },
        {
          label: "水表",
          name: "2",
          groupId: ""
        }
      ],
      switchItemLoading: null,
      switchItemLoading1: null,
      orzId: "",
      orzId1: "", // 批量区域id
      useMeterDialogShow: false,
      dedId: "",
      dedDialog: false,
      dedNum: "",
      caliTime: "",
      pageNumCali: 1,
      pageSizeCali: 10,
      caliTitle: "",
      caliRecordDialogVisible: false,
      caliLoading: false,
      caliTotal: null,
      caliData: [],
      // 二维码区域---------------------------------------------------------
      eqCodeObject: {}, // 二维码当前项数据信息
      eqDialogShow: false, // 控制二维码弹框显示隐藏的布尔值,
      tenantId: null, // 获取用户登录是什么厂商
      // 水表任务区域----------------------------------------------------------
      WaterMeterTaskTitle: "", // 水表任务弹框名称
      WaterMeterTaskShow: false, // 水表任务弹框的显示隐藏布尔值
      WaterMeterTaskActive: "first", // 默认在拉合闸tab处
      WaterMeterTaskForm: {
        isCarryTask: false, // 是否执行任务
        isValve: false, // 是否阀门打开
        setTime: "", // 设置时间
        completeTime: "" // 完成时间
      },

      WaterMeterTaskForm1: {
        isReset: false, // 是否清零
        setTime: "", // 设置时间
        completeTime: "" // 完成时间
      },
      // 批量 ------------------------------------------------------------
      ResultInFo: "", // 批量操作返回的结果信息
      batchFlag: null, //用户选择那种批量方式（1充值 or 0清零 2拉合闸）目前
      oprationTitle: "",
      pageNum1: 1,
      pageSize1: 10,
      total1: null,
      piliang_show: false, // 控制批量操作列表弹框显示
      // 充值
      BatchRechargeShow: false, // 充值金额弹框的显示隐藏
      BatchRechargeListShow: false, // 可充值设备列表弹框显示隐藏
      BatchRechargeForm: {
        money: 0
      },
      rechargeTableData: [], // 可批量数据
      bachIds: [], // 批量勾选的id集合(充值，清零的勾选数据)
      clearSwitch: 1, // / 用户选择是否执行水表任务清零绑定的值
      //
      control: false, // 控制电表拉合闸用户选择绑定的值
      controloptions: [
        {
          value: true,
          label: "拉闸"
        },
        {
          value: false,
          label: "合闸"
        }
      ],
      clearSwitchoptions: [
        {
          value: 1,
          label: "执行"
        },
        {
          value: 0,
          label: "不执行"
        }
      ],
      controlSwitch: 1, //  是否执行开关阀任务(1:执行, 0:不执行)
      controlType: 1, // 开关阀(1:开阀, 0:关阀)
      controlSwitchoptions: [
        {
          value: 1,
          label: "执行"
        },
        {
          value: 0,
          label: "不执行"
        }
      ],
      controlTypeoptions: [
        {
          value: 1,
          label: "开阀"
        },
        {
          value: 0,
          label: "关阀"
        }
      ],
      // 清零

      rules: {
        //  required: true, message: '请输入充值金额', trigger: ['blur','change'] ,
        money: [{ validator: this.validateMoney }],

        sortValue: [{ validator: this.validateSort }]
      },
      // 排序部分------------------------------------------------------------
      sortType: Number(localStorage.getItem("sortType")) || null, // 下拉选择的值

      sortList: [
        {
          sortType: 1,
          sortName: "名称正序"
        },
        {
          sortType: 2,
          sortName: "名称倒序"
        },
        {
          sortType: 3,
          sortName: "安装时间正序"
        },
        {
          sortType: 4,
          sortName: "安装时间倒序"
        },
        {
          sortType: 5,
          sortName: "自定义正序"
        },
        {
          sortType: 6,
          sortName: "自定义倒序"
        }
      ],
      sortDialogShow: false,
      sortMeterList: {},
      sortForm: {
        sortValue: null
      },
      // 分组区域-----------------------------------
      // 分组数据
      meterTitleList: [],
      meterTitleList1: [],
      meterTitleList2:[]// 批量操作切换的分组数据
    };
  },

  created() {
    this.tenantId = sessionStorage.getItem("tenantId");
    console.log("什么厂商", this.tenantId, this.groupId);

    this.pageSize = Number(sessionStorage.getItem("pageSize")) || 10;
    this.pageNum = Number(sessionStorage.getItem("pageNum")) || 1;
    //  start
    console.log("监听路由对象信息", this.$route.query);
    //
    const flag = Object.keys(this.$route.query);
    // 页面跳转
    if (flag.length > 0) {
      // 调用设备类型    设备分页的方法
      //
      console.log("变化了");
      this.meterType = this.$route.query.meterType;
      if (this.$route.query.meterType == 1) {
        this.activeName = "1";
      } else {
        this.activeName = "2";
      }
      // 将携带的数据对象赋值给当前表格
      console.log("8888", this.$route.query.row);

      // this.tableData=[this.$route.query.row]
    } else {
      // 暂无操作
    }
    //##  获取设备分页  ---这里添加新的筛选字段(meterId)
    this.getMeter(
      this.pageNum,
      this.pageSize,
      this.groupId,
      this.meterModelId,
      this.searchMeterName,
      this.meterType,
      this.orzId,
      this.sortType
    );
    this.getTimes();
    this.getOrz();
    // 获取设备统计数据
    this.getDeviceNum(this.groupId, this.meterType, this.orzId);
    // end
  },
  destroyed() {
    sessionStorage.removeItem("pageNum");
    sessionStorage.removeItem("pageSize");
  },
  methods: {
    // 点击批量按钮弹出批量操作按钮的方法
    piLiang() {
      this.piliang_show = true;
    },
    // 监听输入框变化的事件---分组选择  用户输入后过滤数据方法
    inputFn(val) {
      console.log("输入框输入了什么", val);
      let arr = [];
      this.meterTitleList.filter(v => {
        if (v.groupName.indexOf(val) !== -1) {
          console.log("进来了", val);

          arr.push(v);
        } else {
          console.log("进来了123131", val);
        }
        this.meterTitleList1 = arr;
      });
    },
    // 自定义排序确认提交
    sort_confirm() {
      this.$refs.sortForm.validate(valid => {
        if (valid) {
          // alert('提交成功！')
          setSortOrder(this.sortMeterList.meterId, {
            sort: this.sortForm.sortValue * 1
          })
            .then(res => {
              console.log("res", res);
              this.$message.success("操作成功!");
            })
            .catch(error => {
              this.$message.success(`${error}`);
            });

          this.sortDialogShow = false;
        } else {
          console.log("error submit!!");
          this.$message.error("error submit!!");
          return false;
        }
      });
    },
    // 自定义排序
    setSort(e) {
      console.log("e", e);
      this.sortDialogShow = true;
      this.sortForm.sortValue = e.sort;
      this.sortMeterList = e;
    },
    caliChange(e) {
      console.log(e);
      this.pageNumCali = 1;
      this.caliTime = e + "-01";
      this.caliRecord(
        this.meterId,
        this.caliTime,
        this.pageNumCali,
        this.pageSizeCali
      );
    },
    handleSizeChangeCali() {
      this.caliRecord(this.meterId, this.caliTime, this.pageNumCali, val);
      this.pageSizeCali = val;
    },
    handleCurrentChangeCali() {
      this.caliRecord(this.meterId, this.caliTime, val, this.pageSizeCali);
      this.pageNumCali = val;
    },
    openCaliRecord(e) {
      this.meterId = e.meterId;
      this.caliTitle = `校准记录${e.meterName}`;
      this.caliRecordDialogVisible = true;
      this.getTimes();
      this.caliRecord(
        e.meterId,
        this.caliTime,
        this.pageNumCali,
        this.pageSizeCali
      );
    },
    addDed() {
      let that = this;
      if (Number(this.dedNum) && Number(this.dedNum) > 0) {
        this.$confirm("请确认是否抵消金额", "抵消金额", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            let loading = this.$loading({
              lock: true,
              text: "抵消中..."
            });
            let payData = {
              amount: Number(that.dedNum).toFixed(2)
            };
            dedApi(that.dedId, payData).then(Res => {
              if (Res.code == 200) {
                that.dedDialog = false;
                loading.close();
                that.dedNum = "";
                this.$message.success("抵消成功");
                that.search();
              } else {
                loading.close();
                that.dedNum = "";
                that.dedDialog = false;
              }
            });
          })
          .catch(() => {
            this.dedNum = "";
            this.dedDialog = false;
          });
      } else {
        this.$message.error("请输入有效抵消金额！");
      }
    },
    // 抵消金额
    ded(e) {
      this.dedId = e.meterId;
      let ver = e.ver;
      if (
        (ver.slice(0, 2).toUpperCase() == "AB" &&
          Number(ver.slice(ver.length - 4)) >= 13) ||
        (ver.slice(0, 2).toUpperCase() == "AF" &&
          Number(ver.slice(ver.length - 4)) >= 34) ||
        (ver.slice(0, 2).toUpperCase() == "AD" &&
          Number(ver.slice(ver.length - 4)) >= 12) ||
        (ver.slice(0, 2).toUpperCase() == "AE" &&
          Number(ver.slice(ver.length - 4)) >= 17)
      ) {
        this.dedDialog = true;
      } else {
        this.$message.error("版本不匹配!");
      }
    },
    // 导出
    out() {
      let loading = this.$loading({
        lock: true,
        text: "正在导出..."
      });
      OneOutApi(this.timeData.date, this.timeData.dateOperation, this.meterId)
        .then(res => {
          if (
            res.type ==
            "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
          ) {
            let blob = new Blob([res], { type: "application/octet-stream" });
            const link = document.createElement("a");
            link.style.display = "none";
            link.href = URL.createObjectURL(blob);
            link.setAttribute("download", this.meterName + "-能耗分析.xlsx");
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
            loading.close();
          }
        })
        .catch(() => {
          loading.close();
        });
    },
    // 打开修改区域
    openArea(e) {
      this.meterId = e.meterId;
      this.changeAreaShow1 = true;
    },
    editArea() {
      let arr = {
        areaId: this.areaId,
        meterIds: this.ids
      };
      editOrzApi(arr).then(res => {
        if (res.code == 200) {
          this.changeAreaShow = false;
          this.$message.success("修改成功!");
          this.pageNum = 1;
          this.search();
          this.changeArea = "";
        }
      });
    },
    editArea1() {
      let arr = {
        areaId: this.areaId,
        meterIds: [this.meterId]
      };
      editOrzApi(arr).then(res => {
        if (res.code == 200) {
          this.changeAreaShow1 = false;
          this.$message.success("修改成功!");
          this.pageNum = 1;
          this.search();
          this.changeArea1 = "";
        }
      });
    },
    handleChange(e) {
      console.log("xuanz", e);

      this.areaId = e[e.length - 1];
    },
    // 获取设备数量
    getDeviceNum(groupId, meterType, orzId) {
      getDeviceNumApi(groupId, meterType, orzId).then(res => {
        if (res.code == 200) {
          this.deviceCount = res.data.deviceCount;
          this.deviceOffCount = res.data.deviceOffCount;
          this.deviceOnCount = res.data.deviceOnCount;
          this.deviceRemainCount = res.data.deviceRemainCount;
          this.deviceUseCount = res.data.deviceUseCount;
        }
      });
    },
    // 区域--------------------------------------------------------------------
    filterNode(value, data) {
      console.log("区域11111", value, data);
      if (!value) return true;
      return data.orzName.indexOf(value) !== -1;
    },
    // 分组
    filterNode1(value, data) {
      console.log("分组1231", value, data);
      console.log("输入值", data.groupName.indexOf(value) !== -1);

      if (!value) return true;
      return data.groupName.indexOf(value) !== -1;
    },
    // 初始化区域列表----------------------------------------------------------
    getOrz() {
      getOrzApi().then(res => {
        if (res.code == 200) {
          this.treeData1 = res.data == null ? [] : res.data; // 解决数据为null时后台报错问题(9-13)

          this.treeData = [
            {
              orzName: "全部",
              orzId: "",
              children: res.data == null ? [] : [...res.data] // 解决数据为null时后台报错问题(9-13)
            }
            
          ];
          
          this.batchData = [
            {
              orzName: "全部",
              orzId: "",
              children: res.data == null ? [] : [...res.data] // 解决数据为null时后台报错问题(9-13)
            }
            
          ];
          console.log("treeData", this.treeData);
          console.log("batchData", this.batchData);

          // 测试数据
          //   this.treeData= [{
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },

          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },

          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },

          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },

          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },

          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },

          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },
          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },
          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },
          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },
          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },
          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },
          // {
          //   label: '一级 1',
          //   children: [{
          //     label: '二级 1-1',
          //     children: [{
          //       label: '三级 1-1-1'
          //     }]
          //   }]
          // }, {
          //   label: '一级 2',
          //   children: [{
          //     label: '二级 2-1',
          //     children: [{
          //       label: '三级 2-1-1'
          //     }]
          //   }, {
          //     label: '二级 2-2',
          //     children: [{
          //       label: '三级 2-2-1'
          //     }]
          //   }]
          // },

          // {
          //   label: '一级 3',
          //   children: [{
          //     label: '二级 3-1',
          //     children: [{
          //       label: '三级 3-1-1'
          //     }]
          //   }, {
          //     label: '二级 3-2',
          //     children: [{
          //       label: '三级 3-2-1'
          //     }]
          //   }]
          // }]
        }
      });
    },
    // 初始化分组列表
    getGroup() {
      this.loading = true;
      let that = this;
      that.meterTitleList = [
        {
          groupId: "",
          groupName: "全部"
          // disabled:true
        }

      ];
      that.meterTitleList1 = [
        {
          groupId: "",
          groupName: "全部"
          // disabled:true
        }
      ];
      that.meterTitleList2 = [
        {
          groupId: "",
          groupName: "全部"
          // disabled:true
        }
      ];

      getGroupApi().then(res => {
        if (res.code == 200) {
          console.log("获取分组", res);
          /* 
             this.treeData = [
            {
              orzName: "全部",
              orzId: "",
              children: res.data == null ? [] : [...res.data] // 解决数据为null时后台报错问题(9-13)
            }
          
          */
          if (res.data.length !== 0) {
            that.meterTitleList.push(...res.data);
            that.meterTitleList1.push(...res.data);
        // 判断是首页还是批量里面的分组切换避免重复渲染
            that.meterTitleList2.push(...res.data);
            console.log("6", that.meterTitleList);
            console.log("meterTitleList2", that.meterTitleList2);
          }

          this.loading = false;
        }
      });
    },
    // 树点击触发的方法
    handleNodeClick(e) {
      console.log("tab", e);
      this.pageNum=1
      this.pageSize=10

      // 区域选择
      if (this.fz_qy_activeName == "first") {
        this.orzId = e.orzId;
      }
      // 分组选择
      else {
        if (e.groupId == "" || e.groupId == 1 || e.groupId == 2) {
          this.groupId='';
        } else {
          this.groupId = e.groupId;
        }
      }

      this.getDeviceNum(this.groupId, this.meterType, this.orzId);
      this.search();
    },

    //     //批量操作树点击的方法
        handleNodeClick1(e) {
      console.log("批量操作点击数节点", e);
      this.pageNum1=1
      this.pageSize1=10

      // 区域选择
      if (this.fz_qy_activeName1 == "first1") {
        this.orzId1 = e.orzId;
        this.groupId1=''
        console.log('点击了区域',this.orzId1);

        
      }
      // 分组选择
      else if(this.fz_qy_activeName1 == "second1") {
        // if (e.groupId == "" || e.groupId == 1 || e.groupId == 2) {
        // } else {
        
         
        // }
        this.groupId1 = e.groupId;
        this.orzId1 =''
        console.log('点击了分组',this.groupId1);
      }
// 判断是什么设备 + 什么操作类型

      // 清零操作
      if (this.batchFlag == 0) {
        console.log("this.factiveName", this.activeName);
        this.oprationTitle = "批量清零";
        // 判断是电表还水表
        if (this.activeName == "1") {
          // 电表获取
          this.initPoverResetList(
            this.meterType,
            this.pageNum1,
            this.pageSize1,this.orzId1,this.groupId1
          );
        } else {
          // 水表获取
          console.log("水表获取清零");

          this.initWaterResetList(
            this.meterType,
            this.pageNum1,
            this.pageSize1,this.orzId1,this.groupId1
          );
        }
        // 筛选筛选出来可（清零的设备
   
        this.BatchRechargeListShow = true;

        //
      } else if (this.batchFlag == 1) {
        // 执行充值
        this.oprationTitle = "批量充值";
        // 筛选筛选出来可充值的设备
        this.initRechareList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        this.BatchRechargeListShow = true;
        // 弹框弹出
        // console.log("表格数据", this.tableData);
      } else if(this.batchFlag == 2) {
        //拉合闸
        console.log("拉合闸1111");
        // 电表
        if (this.activeName == "1") {
          this.oprationTitle = "批量拉合闸";
          this.getControlMultiList(
            this.meterType,
            this.pageNum1,
            this.pageSize1,this.orzId1,this.groupId1
          );
        }
        // 水表
        else {
          this.oprationTitle = "批量水表任务";
          this.setWaterOffControlList(
            this.meterType,
            this.pageNum1,
            this.pageSize1,this.orzId1,this.groupId1
          );
        }
        this.BatchRechargeListShow = true;
      }






    },
    // 区域--------------------------------------------------------------------
    // 编辑地址名称-----------------------------------------------------------------
    openEdit(e) {
      this.meterId = e.meterId;
      this.deviceForm = {
        name: e.meterName,
        address: e.meterAddress
      };
      this.deviceDialogShow = true;
    },
    edit() {
      let Loading = this.$loading({
        target: document.querySelector(".deviceDialog .el-dialog"),
        lock: true,
        text: "修改中."
      });
      editMeterApi(this.meterId, this.deviceForm)
        .then(res => {
          if (res.code == 200) {
            Loading.close();
            this.$message.success("修改成功!");
            this.deviceDialogShow = false;
            this.search();
          } else {
            Loading.close();
          }
        })
        .catch(() => {
          Loading.close();
        });
    },
    // 编辑地址名称-----------------------------------------------------------------
    // 管理员充值---------------------------------------------------------------------
    closeDialogPay() {
      this.inputPrice = "";
    },
    // 聚焦
    focus() {
      this.meterInfo.meter = 0;
      this.money = "";
      for (var i = 0; i < this.moneyList.length; i++) {
        this.moneyList[i].select = false;
      }
    },
    // 监听金额
    input(e) {
      if (e > 0) {
        this.meterInfo.meter = (
          e /
          this.meterInfo.meterSinglePrice /
          this.meterInfo.chargeTimes
        ).toFixed(2);
      } else {
        this.inputPrice = "";
        this.meterInfo.meter = "0";
      }
    },
    // 检查待充电订单
    check(id) {
      checkApi(id).then(res => {
        if (res.code == 200) {
          if (res.data.isPay == -1) {
            this.canPay = false;
          } else {
            this.canPay = true;
            this.$confirm(
              `您有一笔待充电订单(电量未到账)！点击下方确认按钮或进入小程序充值页面完成此订单后即可继续充值!`,
              "温馨提示",
              {
                confirmButtonText: "确认",
                cancelButtonText: "取消",
                type: "warning"
              }
            )
              .then(() => {
                let Loading = this.$loading({
                  target: document.querySelector(".dialogPay .el-dialog"),
                  lock: true,
                  text: "充值中..."
                });
                copyApi(id)
                  .then(res => {
                    if (res.code == 200) {
                      let arr = {
                        beforeCount: res.data
                      };
                      payAgainApi(id, arr)
                        .then(Res => {
                          if (Res.code == 200) {
                            Loading.close();
                            this.$message.success(
                              "待充电订单充值成功,您可以继续操作!"
                            );
                            this.search();
                          }
                        })
                        .catch(err => {
                          Loading.close();
                        });
                    }
                  })
                  .catch(() => {
                    Loading.close();
                  });
              })
              .catch(() => {
                this.chargeDialogShow = false;
                this.search();
              });
          }
        }
      });
    },
    // 打开充值
    openCharge(e) {
      for (var i = 0; i < this.moneyList.length; i++) {
        this.moneyList[i].select = false;
      }
      this.money = 100;
      this.moneyList[0].select = true;
      this.meterId = e.meterId;
      this.meterInfo.meterName = e.meterName;
      this.meterInfo.meterNumber = e.meterNumber;
      this.meterInfo.meterSinglePrice = e.meterSinglePrice;
      if (e.chargeTimes) {
        this.meterInfo.chargeTimes = Number(e.chargeTimes);
      }
      this.meterInfo.meter = this.money
        ? (
            this.money /
            e.meterSinglePrice /
            this.meterInfo.chargeTimes
          ).toFixed(2)
        : (
            this.inputPrice /
            e.meterSinglePrice /
            this.meterInfo.chargeTimes
          ).toFixed(2);
      this.chargeDialogShow = true;
      this.check(e.meterId);
    },
    // 选择金额
    select(e) {
      this.inputPrice = "";
      for (var i = 0; i < this.moneyList.length; i++) {
        this.moneyList[i].select = false;
      }
      this.money = this.moneyList[e].num;
      this.moneyList[e].select = true;
      this.meterInfo.meter = (
        this.moneyList[e].num /
        this.meterInfo.meterSinglePrice /
        this.meterInfo.chargeTimes
      ).toFixed(2);
    },
    // 充值
    pay() {
      let Loading = this.$loading({
        target: document.querySelector(".dialogPay .el-dialog"),
        lock: true,
        text: "充值中..."
      });
      copyApi(this.meterId).then(res => {
        if (res.code == 200) {
          let arr = {
            beforeCount: res.data,
            isLandlord: 1,
            rechargeAmount: this.money ? this.money : this.inputPrice
          };
          payApi(this.meterId, arr)
            .then(res => {
              if (res.code == 200) {
                Loading.close();
                this.chargeDialogShow = false;
                this.$message.success("充值成功!");
                this.search();
              } else {
                this.$message.error("充值失败!");
                Loading.close();
              }
            })
            .catch(() => {
              Loading.close();
            });
        }
      });
    },
    // 管理员充值---------------------------------------------------------------------
    // 设置单价-----------------------------------------------------------------------
    // 批量
    handleSelectionChange(e) {
      let arr = [];
      e.forEach(item => {
        arr.push(item.meterId);
      });
      this.ids = arr;
    },

    setMorePrice() {
      if (this.singleForm1.singlePrice) {
        // 66666666666666
        let setPriceLoading = this.$loading({
          target: document.querySelector(".dialogMoreSetPice .el-dialog"),
          lock: true
        });
        let arr = {
          meterIds: this.ids,
          singlePrice: this.singleForm1.singlePrice
        };
        setMorePriceApi(arr).then(res => {
          if (res.code == 200) {
            setPriceLoading.close();
            this.$message.success("修改单价成功!");
            this.singleForm1.singlePrice = "";
            this.search();
            this.singleMorePriceDialogShow = false;
          }
        });
      } else {
        this.$message.error("单价不可为空!");
      }
    },
    // 获取单价
    openSinglePrice(e) {
      this.meterId = e.meterId;
      this.singlePriceDialogShow = true;
      this.singleForm.singlePrice = e.meterSinglePrice;
    },
    // 确认修改单价
    setPrice() {
      if (this.singleForm.singlePrice) {
        let setPriceLoading = this.$loading({
          target: document.querySelector(".dialogSetPice .el-dialog"),
          lock: true
        });
        let arr = {
          meterId: this.meterId,
          singlePrice: this.singleForm.singlePrice
        };
        setPriceApi(arr).then(res => {
          if (res.code == 200) {
            setPriceLoading.close();
            this.$message.success("修改单价成功!");
            this.search();
            this.singlePriceDialogShow = false;
          }
        });
      } else {
        this.$message.error("单价不可为空!");
      }
    },
    // 设置单价-----------------------------------------------------------------------
    //详情---------------------------------------------------------------------------
    // 获取用电分析
    getTimeAnalysis(id, date, dateOperation) {
      getTimeAnalysisApi(id, date, dateOperation)
        .then(res => {
          if (res.code == 200) {
            if (this.detailLoading) {
              this.detailLoading.close();
              this.detailLoading = null;
            }
            this.amount = res.data.amount;
            let opt = [];
            let val = [];
            res.data.amountBacks.forEach(item => {
              opt.push(
                item.date +
                  (this.timeData.dateOperation == "year" ? "月" : "日")
              );
              val.push(item.count);
            });
            this.optionData = opt;
            this.searyData = val;
            this.initLine();
          }
        })
        .catch(() => {
          if (this.detailLoading) {
            this.detailLoading.close();
            this.detailLoading = null;
          }
        });
    },
    // 折线图
    initLine() {
      let myChart = this.$echarts.init(this.$refs.line);
      let option = {
        xAxis: {
          type: "category",
          boundaryGap: false, //距离坐标轴是否有间隙
          data: this.optionData,
          axisTick: {
            show: false
          }
        },
        yAxis: {
          type: "value",
          name: this.meterType == 1 ? "用电量（度）" : "用水量（m³）",
          minInterval: 1
        },
        tooltip: {
          // 提示框
          trigger: "axis", // 触发类型  axis：坐标轴   item：图形  none：不触发
          axisPointer: {
            //坐标轴指示器
            lineStyle: {
              color: "#278BFF"
            }
          }
        },
        series: [
          {
            name: this.meterType == 1 ? "用电量（度）" : "用水量（m³）",
            data: this.searyData,
            type: "line",
            smooth: 0.6,
            lineStyle: {
              color: "#5470C6",
              width: 2
            },
            areaStyle: {
              color: this.$echarts.graphic.LinearGradient(
                0,
                0,
                0,
                1,
                [
                  {
                    offset: 0,
                    color: "#31d1e9"
                  },
                  {
                    offset: 1,
                    color: "rgba(196, 196, 196, 0)"
                  }
                ],
                false
              ),
              shadowColor: "rgba(0, 0, 0, 0.1)",
              shadowBlur: 10
            }
          }
        ]
      };
      myChart.setOption(option);
    },
    // 获取时间
    getTimes() {
      let year = new Date().getFullYear();
      let month = new Date().getMonth() + 1;
      let day = new Date().getDate();
      if (month < 10) {
        month = "0" + month;
      }
      if (day < 10) {
        day = "0" + day;
      }
      this.timeData.date = year + "-" + month + "-" + day;
      this.copyTime = year + "-" + month + "-" + day;
      this.clearTime = year + "-" + month + "-" + day;
      this.dedTime = year + "-" + month + "-" + day;
      this.caliTime = year + "-" + month + "-" + day;
    },
    // 获取充值方式
    getChargeType() {
      getChargeTypeApi()
        .then(res => {
          if (res.code == 200) {
            if (res.data == 1) {
              this.payWay = "线上支付";
            } else {
              this.payWay = "线下支付";
            }
          }
        })
        .catch(() => {
          if (this.detailLoading) {
            this.detailLoading.close();
            this.detailLoading = null;
          }
        });
    },
    // 选择年 或者日期
    dateChange() {
      if (this.timeData.date) {
        this.getTimeAnalysis(
          this.meterId,
          this.timeData.date,
          this.timeData.dateOperation
        );
        // getTimeAnalysisApi(
        //   this.meterId,
        //   this.timeData.date,
        //   this.timeData.dateOperation
        // ).then((res) => {
        //   let opt = [];
        //   let val = [];
        //   res.data.forEach((item) => {
        //     opt.push(
        //       item.date + (this.timeData.dateOperation == "year" ? "月" : "日")
        //     );
        //     val.push(item.count);
        //   });
        //   this.optionData = opt;
        //   this.searyData = val;
        //   this.initLine();
        // });
      }
    },
    // 打开详情
    openDetail(e) {
      this.detailLoading = this.$loading({
        target: document.querySelector(".dialogDetail .el-dialog"),
        lock: true
      });
      this.infoDialogVisible = true;
      this.meterId = e;
      this.getTimes();
      this.getOneMeter(e);
      this.getChargeType();
      this.getTimeAnalysis(e, this.timeData.date, this.timeData.dateOperation);
    },
    // 获取单一电表信息
    getOneMeter(e) {
      getOneMeterApi(e)
        .then(res => {
          if (res.code == 200) {
            this.meterName = res.data.meterName;
            this.meterAddress = res.data.meterAddress;
            this.meterModel = res.data.meterModel;
            this.meterNumber = res.data.meterNumber;
            this.imei = res.data.imei;
            this.iccid = res.data.iccid;
            this.meterUseCount = res.data.meterUseCount;
            this.meterSurplusCount = res.data.meterSurplusCount;
            this.meterStatus = res.data.meterStatus;
            this.meterSinglePrice = res.data.meterSinglePrice;
            this.meterReadingTime = res.data.meterReadingTime;
            this.chargeTimes = res.data.chargeTimes;
            this.voltage = res.data.voltage;
            this.ampere = res.data.ampere;
            this.batLow = res.data.batLow;
          }
        })
        .catch(() => {
          if (this.detailLoading) {
            this.detailLoading.close();
            this.detailLoading = null;
          }
        });
    },
    //详情---------------------------------------------------------------------------
    //充值记录---------------------------------------------------------------------------
    // 选择充值记录时间触发
    chargeTimeChange(e) {
      this.pageNumCharge = 1;
      this.chargeTime = e;
      this.getChargeRecord(
        this.meterId,
        this.pageNumCharge,
        this.pageSizeCharge,
        e,
        this.chargeType
      );
    },
    //选择充值记录类型触发getChargeRecord
    chargeChange(e) {
      this.pageNumCharge = 1;
      this.chargeType = e;
      this.getChargeRecord(
        this.meterId,
        this.pageNumCharge,
        this.pageSizeCharge,
        this.chargeTime,
        e
      );
    },
    // 打开充值记录
    openChargeRecord(e) {
      this.meterId = e.meterId;
      this.chargeTitle = `充值记录——${e.meterName}`;
      this.chargeRecordDialogVisible = true;
      this.getTime();
      this.getChargeRecord(
        e.meterId,
        this.pageNumCharge,
        this.pageSizeCharge,
        this.chargeTime,
        this.chargeType
      );
    },
    // 获取当前时间
    getTime() {
      let date = new Date();
      let year = date.getFullYear();
      let month = date.getMonth() + 1;
      if (month < 10) {
        month = "0" + month;
      }
      this.chargeTime = year + "-" + month;
    },
    //获取充值记录
    getChargeRecord(id, pageNum, pageSize, rechargeTime, rechargeWay) {
      this.chargeLoading = true;
      getChargeRecordApi(id, pageNum, pageSize, rechargeTime, rechargeWay).then(
        res => {
          if (res.code == 200) {
            if (res.data == null) {
              this.pageNumCharge = this.pageNumCharge - 1;
              if (this.pageNumCharge > 0) {
                this.getChargeRecord(
                  this.meterId,
                  this.pageNumCharge,
                  this.pageSizeCharge,
                  this.chargeTime,
                  this.chargeType
                );
              } else {
                this.chargeLoading = false;
                if (res.data) {
                  this.chargeTotal = res.data.total;

                  this.chargeData = res.data.rows;
                } else {
                  this.chargeData = [];
                }
              }
            } else {
              this.chargeTotal = res.data.total;
              this.chargeLoading = false;

              this.chargeData = res.data.rows;
            }
          }
        }
      );
    },
    // 充值分页
    handleSizeChangeCharge(val) {
      this.getChargeRecord(
        this.meterId,
        this.pageNumCharge,
        val,
        this.chargeTime,
        this.chargeType
      );
      this.pageSizeCharge = val;
    },
    handleCurrentChangeCharge(val) {
      this.getChargeRecord(
        this.meterId,
        val,
        this.pageSizeCharge,
        this.chargeTime,
        this.chargeType
      );
      this.pageNumCharge = val;
    },
    //充值记录---------------------------------------------------------------------------
    //抄表记录---------------------------------------------------------------------------
    // 获取抄表记录
    getCopyRecord(meterId, pageNum, pageSize, readingTime) {
      this.copyLoading = true;
      getCopyRecordApi(meterId, pageNum, pageSize, readingTime).then(res => {
        if (res.code == 200) {
          if (res.data == null) {
            this.pageNumCharge = this.pageNumCharge - 1;
            if (this.pageNumCharge > 0) {
              this.getCopyRecord(
                this.meterId,
                this.pageNumCopy,
                this.pageSizeCopy,
                this.copyTime
              );
            } else {
              this.copyLoading = false;
              if (res.data) {
                this.copyTotal = res.data.total;

                this.copyData = res.data.rows;
              } else {
                this.copyData = [];
              }
            }
          } else {
            this.copyTotal = res.data.total;
            this.copyLoading = false;

            this.copyData = res.data.rows;
          }
        }
      });
    },
    // 打开抄表记录
    openCopyRecord(e) {
      this.meterId = e.meterId;
      this.copyTitle = `抄表记录——${e.meterName}`;
      this.copyRecordDialogVisible = true;
      this.getTimes();
      this.getCopyRecord(
        e.meterId,
        this.pageNumCopy,
        this.pageSizeCopy,
        this.copyTime
      );
    },
    copyChange(e) {
      this.pageNumCopy = 1;
      this.copyTime = e;
      this.getCopyRecord(this.meterId, this.pageNumCopy, this.pageSizeCopy, e);
    },
    // 抄表分页
    handleSizeChangeCopy(val) {
      this.getCopyRecord(this.meterId, this.pageNumCopy, val, this.copyTime);
      this.pageSizeCopy = val;
    },
    handleCurrentChangeCopy(val) {
      this.getCopyRecord(this.meterId, val, this.pageSizeCopy, this.copyTime);
      this.pageNumCopy = val;
    },
    //抄表记录---------------------------------------------------------------------------
    //清零记录---------------------------------------------------------------------------
    // 获取清零记录
    clearRecord(clearTime, id, pageNum, pageSize) {
      this.clearLoading = true;
      clearRecordApi(clearTime, id, pageNum, pageSize).then(res => {
        if (res.code == 200) {
          if (res.data == null) {
            this.pageNumClear = this.pageNumClear - 1;
            if (this.pageNumClear > 0) {
              this.clearRecord(
                this.clearTime,
                this.meterId,
                this.pageNumClear,
                this.pageSizeClear
              );
            } else {
              this.clearLoading = false;
              if (res.data) {
                this.clearTotal = res.data.total;

                this.clearData = res.data.rows;
              } else {
                this.clearData = [];
              }
            }
          } else {
            this.clearTotal = res.data.total;
            this.clearLoading = false;

            this.clearData = res.data.rows;
          }
        }
      });
    },
    caliRecord(id, clearTime, pageNum, pageSize) {
      this.caliLoading = true;
      caliRecordApi(id, clearTime, pageNum, pageSize).then(res => {
        if (res.code == 200) {
          if (res.data == null) {
            this.pageNumCali = this.pageNumCali - 1;
            if (this.pageNumCali > 0) {
              this.caliRecord(
                this.meterId,
                this.caliTime,
                this.pageNumCali,
                this.pageSizeCali
              );
            } else {
              this.caliLoading = false;
              if (res.data) {
                this.caliTotal = res.data.total;

                this.caliData = res.data.rows;
              } else {
                this.caliData = [];
              }
            }
          } else {
            this.caliTotal = res.data.total;
            this.caliLoading = false;

            this.caliData = res.data.rows;
          }
        }
      });
    },
    dedRecord(id, dedTime, pageNum, pageSize) {
      this.dedLoading = true;
      dedRecordApi(id, dedTime, pageNum, pageSize).then(res => {
        if (res.code == 200) {
          if (res.data == null) {
            this.pageNumDed = this.pageNumDed - 1;
            if (this.pageNumDed > 0) {
              this.clearRecord(
                this.meterId,
                this.dedTime,
                this.pageNumDed,
                this.pageSizeDed
              );
            } else {
              this.dedLoading = false;
              if (res.data) {
                this.dedTotal = res.data.total;

                this.dedData = res.data.rows;
              } else {
                this.dedData = [];
              }
            }
          } else {
            this.dedTotal = res.data.total;
            this.dedLoading = false;
            this.dedData = res.data.rows;
          }
        }
      });
    },
    clearChange(e) {
      this.pageNumClear = 1;
      this.clearTime = e;
      this.clearRecord(e, this.meterId, this.pageNumClear, this.pageSizeClear);
    },
    dedChange(e) {
      console.log(e);
      this.pageNumDed = 1;
      this.dedTime = e + "-01";
      this.dedRecord(
        this.meterId,
        this.dedTime,
        this.pageNumDed,
        this.pageSizeDed
      );
    },
    handleSizeChangeClear(val) {
      this.clearRecord(this.clearTime, this.meterId, this.pageNumClear, val);
      this.pageSizeClear = val;
    },
    handleCurrentChangeClear(val) {
      this.clearRecord(this.clearTime, this.meterId, val, this.pageSizeClear);
      this.pageNumClear = val;
    },
    handleSizeChangeDed(val) {
      this.dedRecord(this.meterId, this.dedTime, this.pageNumDed, val);
      this.pageSizeDed = val;
    },
    handleCurrentChangeDed(val) {
      this.dedRecord(this.meterId, this.dedTime, val, this.pageSizeDed);
      this.pageNumDed = val;
    },
    // 水表任务
    async openWaterMeterTask(e) {
      console.log("水表任务", e);
      this.meterId = e.meterId;
      this.WaterMeterTaskTitle = `水表任务——${e.meterName}`;
      this.WaterMeterTaskShow = true;
      const res = await getWaterApi(this.meterId);
      console.log("获取拉合闸数据", res);
      // this.WaterMeterTaskForm.isCarryTask =
      //   res.data.controlSwitch == 1 ? true : false;
      // 判断若设置过立即执行任务  ,但是接口返回完成时间不等于null时   就将是否执行阀门开关默认设置为false关闭,反之正常显示
      res.data.endControlTime == null
        ? res.data.controlSwitch == 1
          ? (res.data.controlSwitch = true)
          : (res.data.controlSwitch = false)
        : (this.WaterMeterTaskForm.isCarryTask = false);
      this.WaterMeterTaskForm.isValve =
        res.data.controlType == 1 ? true : false;
      this.WaterMeterTaskForm.setTime = res.data.setControlTime;
      this.WaterMeterTaskForm.completeTime = res.data.endControlTime;
      this.WaterMeterTaskForm.isCarryTask = res.data.controlSwitch;
    },
    // 水表任务taB切换触发的方法
    async WaterMeterTask_handleClick(e) {
      console.log("切换", e);
      // 判断是拉合闸还是清零逻辑

      //拉合闸
      if (e.name == "first") {
        const res = await getWaterApi(this.meterId);
        console.log("获取拉合闸数据", res);
        // this.WaterMeterTaskForm.isCarryTask =
        //   res.data.controlSwitch == 1 ? true : false;
        res.data.endControlTime == null
          ? res.data.controlSwitch == 1
            ? (res.data.controlSwitch = true)
            : (res.data.controlSwitch = false)
          : (this.WaterMeterTaskForm.isCarryTask = false);
        this.WaterMeterTaskForm.isValve =
          res.data.controlType == 1 ? true : false;
        this.WaterMeterTaskForm.setTime = res.data.setControlTime;
        this.WaterMeterTaskForm.completeTime = res.data.endControlTime;
      } else {
        const res = await getWaterclearApi(this.meterId);
        console.log("获取清零逻辑数据", res);
        // this.WaterMeterTaskForm1.isReset =
        //   res.data.clearSwitch == 1 ? true : false;
        //   同上 拉合闸逻辑
        res.data.endClearTime == null
          ? res.data.clearSwitch == 1
            ? (res.data.clearSwitch = true)
            : (res.data.controlSwitch = false)
          : (this.WaterMeterTaskForm1.isReset = false);
        this.WaterMeterTaskForm1.setTime = res.data.setClearTime;
        console.log("清零", this.clearSwitch);
        this.WaterMeterTaskForm1.isReset = res.data.clearSwitch;
        this.WaterMeterTaskForm1.completeTime = res.data.endClearTime;
        console.log("完成时间21312", this.WaterMeterTaskForm1.completeTime);
      }

      // 清零逻辑
    },

    // changeState
    // 水表任务   切换按钮 方法
    changeState(val, e) {
      console.log("99999999", val, e);

      this.$confirm("请确定是否执行此操作, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(async () => {
          // 放在一起处理

          if (val == 1) {
            // 是否执行任务
            console.log("执行任务");

            let data = {
              controlSwitch: e == true ? 1 : 0,
              controlType: e == true ? 1 : 0,
              meterId: this.meterId
            };
            const res = await setWaterApi(data);
            console.log("是否执行任务res", res);
          }
          if (val == 2) {
            // 阀门开关
            console.log("阀门开关");

            let data = {
              controlSwitch:
                this.WaterMeterTaskForm.isCarryTask == true ? 1 : 0,
              controlType: e == true ? 1 : 0,
              meterId: this.meterId
            };
            const res = await setWaterApi(data);
            console.log("阀门开关res", res);
          }
          if (val == 3) {
            // 是否清零
            console.log("是否清零");

            let data = {
              clearSwitch: e == true ? 1 : 0,
              meterId: this.meterId
            };
            const res = await setWaterClearApi(data);
            console.log("是否清零res", res);
          }

          this.$message({
            type: "success",
            message: "操作成功!"
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "取消操作"
          });
        });
    },

    openClearRecord(e) {
      this.meterId = e.meterId;
      this.clearTitle = `清零记录——${e.meterName}`;
      this.clearRecordDialogVisible = true;
      this.getTimes();
      this.clearRecord(
        this.clearTime,
        e.meterId,
        this.pageNumClear,
        this.pageSizeClear
      );
    },
    openDedRecord(e) {
      this.meterId = e.meterId;
      this.dedTitle = `抵消记录——${e.meterName}`;
      this.dedDialog22 = true;
      this.getTimes();
      this.dedRecord(
        e.meterId,
        this.dedTime,
        this.pageNumDed,
        this.pageSizeDed
      );
    },
    // 强制拉闸
    off(e) {
      let text;
      if (this.meterType == 1) {
        text = "拉闸";
      } else {
        text = "关阀";
      }
      this.$confirm(`请确认是否强制${text}?`, `强制${text}`, {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.switchItemLoading = this.$loading({
            lock: true,
            text: `${text}中...`,
            spinner: "el-icon-loading",
            background: "rgba(0, 0, 0, 0.7)"
          });
          controlApi(e.meterId, { control: true })
            .then(res => {
              if (res.code == 200) {
                this.switchItemLoading.close();
                this.$message.success(`${text}成功`);
                this.search();
              } else {
                this.switchItemLoading.close();
                e.meterStatus = !e.meterStatus;
              }
            })
            .catch(() => {
              this.switchItemLoading.close();
              e.meterStatus = !e.meterStatus;
            });
        })
        .catch(() => {
          e.meterStatus = !e.meterStatus;
        });
    },
    //清零记录---------------------------------------------------------------------------
    // 拉合闸
    switchItem(e) {
      let text1;
      let text2;
      if (this.meterType == 1) {
        text1 = "合闸";
        text2 = "拉闸";
      } else {
        text1 = "开阀";
        text2 = "关阀";
      }
      if (e.meterStatus == true) {
        this.$confirm(`请确认是否强制${text1}?`, `强制${text1}`, {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            this.switchItemLoading = this.$loading({
              lock: true,
              text: `${text1}中...`,
              spinner: "el-icon-loading",
              background: "rgba(0, 0, 0, 0.7)"
            });
            controlApi(e.meterId, { control: false })
              .then(res => {
                if (res.code == 200) {
                  this.switchItemLoading.close();
                  this.$message.success(`${text1}成功`);
                  this.getMeter(
                    this.pageNum,
                    this.pageSize,
                    this.groupId,
                    this.meterModelId,
                    this.searchMeterName,
                    1,
                    this.orzId,
                    this.sortType
                  );
                } else {
                  this.switchItemLoading.close();
                  e.meterStatus = !e.meterStatus;
                }
              })
              .catch(() => {
                this.switchItemLoading.close();
                e.meterStatus = !e.meterStatus;
              });
          })
          .catch(() => {
            e.meterStatus = !e.meterStatus;
          });
      } else {
        this.$confirm(`请确认是否强制${text2}?`, `制拉${text2}`, {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            this.switchItemLoading = this.$loading({
              lock: true,
              text: `${text2}中...`,
              spinner: "el-icon-loading",
              background: "rgba(0, 0, 0, 0.7)"
            });
            controlApi(e.meterId, { control: true })
              .then(res => {
                if (res.code == 200) {
                  this.switchItemLoading.close();
                  this.$message.success(`${text2}成功`);
                  this.search();
                } else {
                  this.switchItemLoading.close();
                  this.search();
                }
              })
              .catch(() => {
                this.switchItemLoading.close();
                this.search();
              });
          })
          .catch(() => {
            e.meterStatus = !e.meterStatus;
          });
      }
    },
    // 禁用
    switchItem2(e) {
      console.log("e", e);
      if (e.isForbid == true) {
        this.$confirm("请确认是否禁用该设备", `禁用`, {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            this.switchItemLoading1 = this.$loading({
              lock: true,
              text: `禁用中...`,
              spinner: "el-icon-loading",
              background: "rgba(0, 0, 0, 0.7)"
            });
            let arr = {
              isForbid: true
            };
            postIsForbidApi(e.meterId, arr)
              .then(res => {
                if (res.code == 200) {
                  this.switchItemLoading1.close();
                  this.$message.success(`禁用成功!`);
                  this.search();
                }
              })
              .catch(err => {
                this.switchItemLoading1.close();
                this.search();
              });
          })
          .catch(() => {
            // this.search();
            e.isForbid = !e.isForbid;
          });
      } else {
        this.$confirm("请确认是否解禁该设备", `解除限制`, {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(res => {
            this.switchItemLoading1 = this.$loading({
              lock: true,
              text: `解禁中...`,
              spinner: "el-icon-loading",
              background: "rgba(0, 0, 0, 0.7)"
            });
            let arr = {
              isForbid: false
            };
            postIsForbidApi(e.meterId, arr)
              .then(res => {
                if (res.code == 200) {
                  this.switchItemLoading1.close();
                  this.$message.success(`解禁成功!`);
                  this.search();
                }
              })
              .catch(err => {
                this.switchItemLoading1.close();
                this.search();
              });
          })
          .catch(err => {
            // this.search();
            e.isForbid = !e.isForbid;
          });
      }
    },
    // 切换类型
    handleClick(e) {
      // console.log(e, [e.index].groupId);
      console.log("点击了", this.activeName);
      this.pageNum = 1;
      if (this.titleList[e.index].groupId == "") {
        console.log("切换类型", this.groupId);

        this.groupId = "";
        this.meterType = Number(e.index) + 1;
        this.getDeviceNum(this.groupId, this.meterType, this.orzId);
        this.search();
      } else {
        this.meterType = "";
        this.groupId = this.titleList[e.index].groupId;
        console.log("this.groupId", this.groupId);

        this.getDeviceNum(this.groupId, this.meterType, this.orzId);
        this.search();
      }
    },

    //左侧 区域和分组切换的乐行

    fz_qy_handleClick(e) {
      console.log("切换分组和区域tab", e);
      // 判断点击的是区域选择还是分组选择
      if (e.name == "first") {
        this.groupId = "";
        this.getOrz();
      } else {
        console.log("走分组选择");
        this.orzId = "";
        this.getGroup();
      }
    },
    // todo-批量
    // 批量---左侧 区域和分组切换
    fz_qy_handleClick1(e) {
      console.log("切换分组和区域tab", e);
      // 判断点击的是区域选择还是分组选择
      if (e.name == "first1") {
        this.groupId1 = "";
        this.getOrz();
      } else {
        console.log("走分组选择");
        this.orzId1 = "";
        this.getGroup();
      }
    },
    // 获取电表列表
    getMeter(
      pageNum,
      pageSize,
      groupId,
      meterModelId,
      meterName,
      meterType,
      orzId,
      sortType = 10
    ) {
      this.loading = true;
      getDeviceApi(
        pageNum,
        pageSize,
        groupId,
        meterModelId,
        meterName,
        meterType,
        orzId,
        sortType
      ).then(res => {
        if (res.data == null) {
          this.pageNum = this.pageNum - 1;
          if (this.pageNum > 0) {
            this.search();
          } else {
            this.loading = false;
            if (res.data) {
              this.total = res.data.total;
              res.data.rows.forEach(item => {
                if (item.meterStatus == 1) {
                  item.meterStatus = true;
                } else {
                  item.meterStatus = false;
                }
              });
              this.tableData = res.data.rows;
            } else {
              this.tableData = [];
            }
          }
        } else {
          this.total = res.data.total;
          this.loading = false;
          res.data.rows.forEach(item => {
            if (item.meterStatus == 1) {
              item.meterStatus = true;
            } else {
              item.meterStatus = false;
            }
          });
          this.tableData = res.data.rows;
        }
      });
    },
    // 电表分页
    handleSizeChange(val) {
      console.log(val);
      this.getMeter(
        this.pageNum,
        val,
        this.groupId,
        this.meterModelId,
        this.searchMeterName,
        this.meterType,
        this.orzId,
        this.sortType
      );
      sessionStorage.setItem("pageSize", val);
      this.pageSize = val;
      // this.$refs.isExpand.bodyWrapper.scrollTop = 0;
      console.log("dddd", this.$refs.isExpand);
    },
    handleCurrentChange(val) {
      this.getMeter(
        val,
        this.pageSize,
        this.groupId,
        this.meterModelId,
        this.searchMeterName,
        this.meterType,
        this.orzId,
        this.sortType
      );
      sessionStorage.setItem("pageNum", val);
      this.pageNum = val;
      // this.$refs.isExpand.bodyWrapper.scrollTop = 0;
      console.log("dddd", this.$refs.isExpand);
    },
    // 查找  ---新增筛选字段
    search() {
      if (this.sortType == null) {
        console.log("没选择排序");
      } else {
        localStorage.setItem("sortType", this.sortType);
      }
      console.log("this.sortType", this.sortType);
      this.getMeter(
        this.pageNum,
        this.pageSize,
        this.groupId,
        this.meterModelId,
        this.searchMeterName,
        this.meterType,
        this.orzId,
        this.sortType
      );
    },
    // 抄表
    copy(e) {
      let loading = this.$loading({
        text: "抄表中...",
        lock: true,
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)"
      });
      copyApi(e)
        .then(res => {
          if (res.code == 200) {
            loading.close();
            this.getMeter(
              this.pageNum,
              this.pageSize,
              this.groupId,
              this.meterModelId,
              this.searchMeterName,
              1,
              this.orzId,
              this.sortType
            );
            this.$message.success("抄表成功!");
          } else {
            loading.close();
          }
        })
        .catch(err => {
          loading.close();
        });
    },
    // 电量清零
    clear(e) {
      this.$confirm(`此操作将清零设备，恢复出厂设置, 是否继续?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let loading = this.$loading({
            text: "清零中...",
            lock: true,
            spinner: "el-icon-loading",
            background: "rgba(0, 0, 0, 0.7)"
          });
          clearApi(e).then(res => {
            if (res.code == 200) {
              loading.close();
              this.search();
              this.$message({
                type: "success",
                message: "清零成功!"
              });
            } else {
              loading.close();
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消清零"
          });
        });
    },
    // 解绑
    del(e) {
      this.$confirm(`此操作将解绑该设备——${e.meterName}, 是否继续?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          let loading = this.$loading({
            text: "解绑中...",
            lock: true,
            spinner: "el-icon-loading",
            background: "rgba(0, 0, 0, 0.7)"
          });
          delApi(e.meterId)
            .then(res => {
              if (res.code == 200) {
                loading.close();
                this.search();
                this.$message({
                  type: "success",
                  message: "解绑成功!"
                });
              } else {
                loading.close();
              }
            })
            .catch(() => {
              loading.close();
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    // 全量 导出设备报表(测试  接口待补充 )--------------
    export_excel() {
      let loading = this.$loading({
        lock: true,
        text: "正在导出，请耐心等候。。。。。。。。"
      });
      deviceManagementExportApi(this.meterType,this.groupId,'','',this.orzId)
        .then(res => {
          if (res.type == "text/xml") {
            let blob = new Blob([res], { type: "text/xml" }); // 这里的type 打印响应拦截器查看type类型相同就行  在响应拦截器再加上或判断返回res
            // let blob = new Blob([res], { type: 'application/octet-stream'}); // 这里的type 打印响应拦截器查看type类型相同就行  在响应拦截器再加上或判断返回res
            const link = document.createElement("a");
            link.style.display = "none";
            link.href = URL.createObjectURL(blob);
            link.setAttribute("download", "设备管理报表.xlsx");
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
            loading.close();
          }
        })
        .catch(() => {
          loading.close();
        });
    },

    // 获取设备二维码
    qrCode(row) {
      console.log("获取二维码", row);
      this.eqDialogShow = true;
      this.eqCodeObject = row;

      let company =
        this.tenantId == 1384239329918976 // 京凡
          ? "https://www.jdzndl.com?"
          : this.tenantId == 1383752023277568 // 程思物联
          ? "https://system.ori-iot.com?"
          : this.tenantId == 1384583899389952 // 浙江弘倡新能源科技
          ? "http://hc.ori-iot.com?"
          : this.tenantId == 1391817055608832 //  美家智控
          ? "http://mjzk.ori-iot.com?"
          : this.tenantId == 1393302150332416 // 玛尚物联
          ? "http://mswl.ori-iot.com?"
          : this.tenantId == 1393500710502400 // 八戒水电
          ? "http://bajie.ori-iot.com?"
          : this.tenantId == 1397483635965952 //   美家智控(仅测试)
          ? "http://bajie.ori-iot.com?"
          : this.tenantId == 1417432882094080 //   好管家()
          ? "http://hwlgj.ori-iot.com?"
            : this.tenantId == 1422255008382976  //  管租婆()   //线上端1422255008382976   //测试端1421554355437568
          ? "http://gzp.ori-iot.com?"
           : this.tenantId == 1423516901507072 // 水电能源管理  // 线上端1423516901507072     测试  1423239078699008
          ? "http://sdnygl.ori-iot.com?"
          : this.tenantId == 1425716189642752 // 水电能源管理  // 线上端1423516901507072     测试  1423239078699008
          ? "http://tpsxtny.ori-iot.com?"
          : "";
      console.log("11213213131", company);
      console.log('9999999',`${company}meterNumber=${row.meterNumber}`);
      this.$nextTick(() => {
        if (this.qrcode) {
          this.$refs.qrCodeUrl.innerHTML = "";
        }
        this.qrcode = new QRCode(this.$refs.qrCodeUrl, {
          text: `${company}meterNumber=${row.meterNumber}`, // 需要转换为二维码的内容
          width: 100,
          height: 100,
          colorDark: "#000000",
          colorLight: "#ffffff"
        });
     
        
      });
    },

    // 批量---------------------------------------
    // 初始化电表清零列表
    async initPoverResetList(meterType, pageNum1, pageSize1,orzId1,groupId1) {
      const res = await getMeterClearMultiDeviceList(
        meterType,
        pageNum1,
        pageSize1,
        orzId1,
        groupId1
      );
      if (res.code == 200) {
        res.data.rows.forEach(v => {
          v["flag"] = null;
        });
        this.rechargeTableData = res.data.rows;
        this.total1 = res.data.total;
      } else {
        this.$message({
          type: "info",
          message: `${res.msg}`
        });
      }
      console.log("电表清零列表", res);
    },
    // 初始化水表清零列表
    async initWaterResetList(meterType, pageNum1, pageSize1,orzId1,groupId1) {
      const res = await getwaterOffClearList(meterType, pageNum1, pageSize1,orzId1,groupId1);
      console.log("水表清零清单", res);
      if (res.code == 200) {
        res.data.rows.forEach(v => {
          v["flag"] = null;
        });
        this.rechargeTableData = res.data.rows;
        this.total1 = res.data.total;
      } else {
        this.$message({
          type: "info",
          message: `${res.msg}`
        });
      }
    },
    // 初始化充值列表
    async initRechareList(meterType, pageNum1, pageSize1,orzId1,groupId1) {
      const res = await getPayMultiDeviceList(meterType, pageNum1, pageSize1,orzId1,groupId1);
      console.log("充值列表", res);
      if (res.code == 200) {
        res.data.rows.forEach(v => {
          v["flag"] = null;
        });
        this.rechargeTableData = res.data.rows;
        this.total1 = res.data.total;
      } else {
        this.$message({
          type: "info",
          message: `${res.msg}`
        });
      }
    },
    // 初始化电表拉合闸设备数据
    async getControlMultiList(meterType, pageNum1, pageSize1,orzId1,groupId1) {
      const res = await getControlMultiDeviceList(
        meterType,
        pageNum1,
        pageSize1,
        orzId1,
        groupId1
      );
      console.log("电表拉合闸设备数据", res);
      if (res.code == 200) {
        res.data.rows.forEach(v => {
          v["flag"] = null;
        });
        this.rechargeTableData = res.data.rows;
        this.total1 = res.data.total;
      } else {
        this.$message({
          type: "info",
          message: `${res.msg}`
        });
      }
    },

    // setWaterOffControlList
    // 初始化水表拉合闸设备数据
    async setWaterOffControlList(meterType, pageNum1, pageSize1,orzId1,groupId1) {
      const res = await getWaterOffMultiDeviceList(
        meterType,
        pageNum1,
        pageSize1,orzId1,groupId1
      );
      console.log("电表拉合闸设备数据", res);
      if (res.code == 200) {
        res.data.rows.forEach(v => {
          v["flag"] = null;
        });
        this.rechargeTableData = res.data.rows;
        this.total1 = res.data.total;
      } else {
        this.$message({
          type: "info",
          message: `${res.msg}`
        });
      }
    },
    //   initRechareList
    // 分页
    handleSizeChange1(val) {
      this.pageSize1 = val;
      if (this.activeName == "1") {
        if(this.batchFlag==0) {
          //清零
          this.initPoverResetList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }else if(this.batchFlag==1) {
          // 充值
          this.initRechareList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }else if(this.batchFlag==2) {
          // 拉合闸
          this.getControlMultiList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }
        // 判断操作类型
      } else {
          // 判断操作类型
        // this.initWaterResetList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);
        if(this.batchFlag==0) {
          //清零
          this.initWaterResetList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }else if(this.batchFlag==1) {
          // 充值
          this.initRechareList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }else if(this.batchFlag==2) {
          // 拉合闸
          this.setWaterOffControlList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }
      }
      this.ResultInFo = "";
    },
    handleCurrentChange1(val) {
      this.pageNum1 = val;
      if (this.activeName == "1") {
        if(this.batchFlag==0) {
          //清零
          this.initPoverResetList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }else if(this.batchFlag==1) {
          // 充值
          this.initRechareList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }else if(this.batchFlag==2) {
          // 拉合闸
          this.getControlMultiList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }
        // 判断操作类型
      } else {
          // 判断操作类型
        // this.initWaterResetList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);
        if(this.batchFlag==0) {
          //清零
          this.initWaterResetList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }else if(this.batchFlag==1) {
          // 充值
          this.initRechareList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }else if(this.batchFlag==2) {
          // 拉合闸
          this.setWaterOffControlList(this.meterType, this.pageNum1, this.pageSize1,this.orzId1,this.groupId1);

        }
      }
      this.ResultInFo = "";
    },

    // 批量操作     （清零   | 充值）
    batchOperation(val) {
      this.batchFlag = val;
      this.bachIds = [];
      // 清零操作
      if (val == 0) {
        console.log("this.factiveName", this.activeName);
        this.oprationTitle = "批量清零";
        // 判断是电表还水表
        if (this.activeName == "1") {
          // 电表获取
          this.initPoverResetList(
            this.meterType,
            this.pageNum1,
            this.pageSize1
          );
        } else {
          // 水表获取
          console.log("水表获取清零");

          this.initWaterResetList(
            this.meterType,
            this.pageNum1,
            this.pageSize1
          );
        }
        // 筛选筛选出来可（清零的设备
        this.BatchRechargeListShow = true;
        console.log("（清零", val);

        //
      } else if (val == 1) {
        // 执行充值
        console.log("执行充值", val);
        this.oprationTitle = "批量充值";
        // 筛选筛选出来可充值的设备
        this.initRechareList(this.meterType, this.pageNum1, this.pageSize1);

        this.BatchRechargeListShow = true;
        // 弹框弹出
        // console.log("表格数据", this.tableData);
      } else {
        //拉合闸
        console.log("拉合闸1111");
        // 电表
        if (this.activeName == "1") {
          this.oprationTitle = "批量拉合闸";
          this.getControlMultiList(
            this.meterType,
            this.pageNum1,
            this.pageSize1
          );
        }
        // 水表
        else {
          this.oprationTitle = "批量水表任务";
          this.setWaterOffControlList(
            this.meterType,
            this.pageNum1,
            this.pageSize1
          );
        }
        this.BatchRechargeListShow = true;
      }
    },

    // 自定义校验规则
    validateMoney(rule, value, callback) {
      // console.log( rule,value,callback);

      if (!value) {
        console.log("没输入进来了");

        return callback(new Error("请输入充值金额"));
      }
      // 校验是否为数字
      const numberPattern = /^\d+(\.\d{1,2})?$/;
      if (!numberPattern.test(value)) {
        console.log("不符合条件");

        return callback(new Error("请输入有效的金额（最多两位小数,金额到分）"));
      }
      callback(); // 验证通过
    },
    // 自定义排序规则
    validateSort(rule, value, callback) {
      // console.log( rule,value,callback);

      if (!value) {
        console.log("没输入进来了");

        return callback(new Error("请输入排序值"));
      }
      // 校验是否为数字
      const regex = /^[1-9][0-9]*$/;
      if (!regex.test(value)) {
        console.log("不符合条件");

        return callback(new Error("请输入有效的数值(大于等于1的正整数)"));
      }
      callback(); // 验证通过
    },
    // 确认批量充值
    confirm_BatchRecharge() {
      // alert('点击了充值')
      this.$refs.BatchRechargeForm.validate(valid => {
        if (valid) {
          const loading = this.$loading({
            lock: true,
            text: "加载中，请稍后",
            spinner: "el-icon-loading"
            // background: 'rgba(0, 0, 0, 0.7)'
          });
          setPayMulti({
            deviceIds: this.bachIds,
            money: this.BatchRechargeForm.money * 1
          }).then(res => {
            if (res.code == 200) {
              console.log("充值结果", res);
              this.ResultInFo = res.data.info;
              // start
              // 勾选成功
              if (res.data.deviceIds.length == 0) {
                console.log("成功的123131！");
                this.rechargeTableData.forEach(item => {
                  if (this.bachIds.includes(item.meterId)) {
                    item.flag = 1;
                  }
                });

                console.log("rechargeTableData", this.rechargeTableData);
              }
              // 勾选返回不成功的
              else {
                console.log("失败的进来了");

                const failArr = res.data.deviceIds; // 失败的集合

                // 根据条件更新标志
                this.rechargeTableData = this.rechargeTableData.map(item => {
                  if (this.bachIds.includes(item.meterId)) {
                    if (failArr.includes(item.meterId)) {
                      // 如果 meterId 同时在 batId 和 failArr 中，设置 flag 为 0
                      return { ...item, flag: 0 };
                    } else {
                      // 如果 meterId 只在 batId 中，设置 flag 为 1
                      return { ...item, flag: 1 };
                    }
                  }
                  // 如果 meterId 不在 batId 中，保留原始项
                  return item;
                });

                // 输出更新后的数组
                console.log("this.rechargeTableData", this.rechargeTableData);
              }
              // end

              // const failArr = res.data.deviceIds; // 失败的集合

              //rechargeTableData
              // 遍历 arr1, 更新 flag属性
              // this.rechargeTableData.forEach(item => {
              //   item.flag = failArr.includes(item.meterId) ? 0 : 1;
              // });
              // console.log("555", this.rechargeTableData);

              loading.close();
              // this.$message.success("充值成功!");

              // 关闭充值弹框
              this.close_BatchRecharge();
              setTimeout(() => {
                this.search();
              }, 500);
              this.search();
            } else {
              this.$message.info(`${res.msg}`);
            }
          });
        } else {
          console.log("error submit!!");
          this.$message.error("error submit!!");
          return false;
        }
      });
    },

    //  关闭批量充值弹框方法
    close_BatchRecharge() {
      // 清楚校验和数值
      this.BatchRechargeShow = false;

      this.$refs.BatchRechargeForm.resetFields();
    },
    //  关闭批量列表弹框方法
    close_BatchRechargeList() {
      // 清楚校验和数值
      this.BatchRechargeListShow = false;
      this.ResultInFo = "";
      this.fz_qy_activeName1='first1'
      this.groupId1=''
      this.orzId1=''
      this.pageNum1=1
      this.pageSize1=10
      // this.bachIds =[];
    },
    // 批量勾选可充值设备方法
    handleSelectionChange1(e) {
      let arr = [];
      e.forEach(item => {
        arr.push(item.meterId);
      });
      this.bachIds = arr;
      console.log("当前选择的设备id集合", this.bachIds);
    },

    // 点击去清零 | 充值 拉合闸按钮触发方法
    confirm_BatchRechargelist() {
      if (this.batchFlag == 0) {
        // 清零
        console.log("走清零去了");
        this.$confirm("此操作将批量清零设备，恢复出厂设置, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            const loading = this.$loading({
              lock: true,
              text: "加载中，请稍后",
              spinner: "el-icon-loading"
              // background: 'rgba(0, 0, 0, 0.7)'
            });
            // 调用批量清零的接口
            console.log("ids设备索引集合", this.bachIds);
            console.log("设备类型", this.meterType);

            // 电表
            if (this.activeName == "1") {
              console.log("电表清零接口");

              setMeterClearMulti({
                deviceIds: this.bachIds
              }).then(res => {
                if ((res.code = 200)) {
                  loading.close();
                  this.ResultInFo = res.data.info;
                  // const failArr = re.data.deviceIds;
                  //rechargeTableData
                  // 遍历 arr1, 更新 flag属性
                  // this.rechargeTableData.forEach(item => {
                  //   item.flag = failArr.includes(item.meterId) ? 0 : 1;
                  // });

                  // start
                  // 勾选成功
                  if (res.data.deviceIds.length == 0) {
                    console.log("成功的123131！");
                    this.rechargeTableData.forEach(item => {
                      if (this.bachIds.includes(item.meterId)) {
                        item.flag = 1;
                      }
                    });

                    console.log("rechargeTableData", this.rechargeTableData);
                  }
                  // 勾选返回不成功的
                  else {
                    console.log("失败的进来了");

                    const failArr = res.data.deviceIds; // 失败的集合

                    // 根据条件更新标志
                    this.rechargeTableData = this.rechargeTableData.map(
                      item => {
                        if (this.bachIds.includes(item.meterId)) {
                          if (failArr.includes(item.meterId)) {
                            // 如果 meterId 同时在 batId 和 failArr 中，设置 flag 为 0
                            return { ...item, flag: 0 };
                          } else {
                            // 如果 meterId 只在 batId 中，设置 flag 为 1
                            return { ...item, flag: 1 };
                          }
                        }
                        // 如果 meterId 不在 batId 中，保留原始项
                        return item;
                      }
                    );

                    // 输出更新后的数组
                    console.log(
                      "this.rechargeTableData",
                      this.rechargeTableData
                    );
                  }
                  // end

                  setTimeout(() => {
                    this.search();
                  }, 300);
                  this.search();
                } else {
                  this.$message.info(`${re.msg}`);
                }
              });
            }
            //
            else {
              // 水表
              console.log("水表清零接口");
              setWaterOffClear({
                clearSwitch: this.clearSwitch,
                deviceIds: this.bachIds
              }).then(re => {
                if ((re.code = 200)) {
                  //
                  // this.initWaterResetList(
                  //   this.meterType,
                  //   this.pageNum1,
                  //   this.pageSize1
                  // );
                  this.ResultInFo = re.data.info;
                  const failArr = re.data.deviceIds;
                  //rechargeTableData
                  // 遍历 arr1, 更新 flag属性
                  // this.rechargeTableData.forEach(item => {
                  //   item.flag = failArr.includes(item.meterId) ? 0 : 1;
                  // });
                  // start
                  // 勾选成功
                  if (re.data.deviceIds.length == 0) {
                    console.log("成功的123131！");
                    this.rechargeTableData.forEach(item => {
                      if (this.bachIds.includes(item.meterId)) {
                        item.flag = 1;
                      }
                    });

                    console.log("rechargeTableData", this.rechargeTableData);
                  }
                  // 勾选返回不成功的
                  else {
                    console.log("失败的进来了");

                    const failArr = res.data.deviceIds; // 失败的集合

                    // 根据条件更新标志
                    this.rechargeTableData = this.rechargeTableData.map(
                      item => {
                        if (this.bachIds.includes(item.meterId)) {
                          if (failArr.includes(item.meterId)) {
                            // 如果 meterId 同时在 batId 和 failArr 中，设置 flag 为 0
                            return { ...item, flag: 0 };
                          } else {
                            // 如果 meterId 只在 batId 中，设置 flag 为 1
                            return { ...item, flag: 1 };
                          }
                        }
                        // 如果 meterId 不在 batId 中，保留原始项
                        return item;
                      }
                    );

                    // 输出更新后的数组
                    console.log(
                      "this.rechargeTableData",
                      this.rechargeTableData
                    );
                  }
                  // end
                  loading.close();
                  setTimeout(() => {
                    this.search();
                  }, 300);
                  this.search();
                } else {
                  this.$message.info(`${re.msg}`);
                }
              });
            }

            // 刷新表格数据

            // this.$message({
            //   type: "success",
            //   message: "操作成功!"
            // });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消操作"
            });
          });
      } else if (this.batchFlag == 1) {
        // 批量充值
        console.log("走充值去了");
        this.BatchRechargeShow = true;
      } else {
        // 批量拉合闸
        console.log("走批量拉合闸");
        const loading = this.$loading({
          lock: true,
          text: "加载中，请稍后",
          spinner: "el-icon-loading"
          // background: 'rgba(0, 0, 0, 0.7)'
        });
        if (this.activeName == "1") {
          // 电
          setMeterControlMulti({
            control: this.control,
            deviceIds: this.bachIds
          }).then(res => {
            if (res.code == 200) {
              this.ResultInFo = res.data.info;
              // const failArr = res.data.deviceIds;
              // this.rechargeTableData.forEach(item => {
              //   item.flag = failArr.includes(item.meterId) ? 0 : 1;
              // });
              // start
              // 勾选成功
              if (res.data.deviceIds.length == 0) {
                console.log("成功的123131！");
                this.rechargeTableData.forEach(item => {
                  if (this.bachIds.includes(item.meterId)) {
                    item.flag = 1;
                  }
                });

                console.log("rechargeTableData", this.rechargeTableData);
              }
              // 勾选返回不成功的
              else {
                console.log("失败的进来了");

                const failArr = res.data.deviceIds; // 失败的集合

                // 根据条件更新标志
                this.rechargeTableData = this.rechargeTableData.map(item => {
                  if (this.bachIds.includes(item.meterId)) {
                    if (failArr.includes(item.meterId)) {
                      // 如果 meterId 同时在 batId 和 failArr 中，设置 flag 为 0
                      return { ...item, flag: 0 };
                    } else {
                      // 如果 meterId 只在 batId 中，设置 flag 为 1
                      return { ...item, flag: 1 };
                    }
                  }
                  // 如果 meterId 不在 batId 中，保留原始项
                  return item;
                });

                // 输出更新后的数组
                console.log("this.rechargeTableData", this.rechargeTableData);
              }
              // end
              // this.$message.success(`操作成功!`)
              loading.close();

              this.search();
            } else {
              this.$message.info(`${res.msg}`);
            }
          });
        } else {
          // 水
          setWaterOffControl({
            controlSwitch: this.controlSwitch,
            controlType: this.controlType,
            deviceIds: this.bachIds
          }).then(res => {
            if (res.code == 200) {
              this.ResultInFo = res.data.info;
              // const failArr = res.data.deviceIds;
              // //rechargeTableData
              // // 遍历 arr1, 更新 flag属性
              // this.rechargeTableData.forEach(item => {
              //   item.flag = failArr.includes(item.meterId) ? 0 : 1;
              // });
              // start
              // 勾选成功
              if (res.data.deviceIds.length == 0) {
                console.log("成功的123131！");
                this.rechargeTableData.forEach(item => {
                  if (this.bachIds.includes(item.meterId)) {
                    item.flag = 1;
                  }
                });

                console.log("rechargeTableData", this.rechargeTableData);
              }
              // 勾选返回不成功的
              else {
                console.log("失败的进来了");

                const failArr = res.data.deviceIds; // 失败的集合

                // 根据条件更新标志
                this.rechargeTableData = this.rechargeTableData.map(item => {
                  if (this.bachIds.includes(item.meterId)) {
                    if (failArr.includes(item.meterId)) {
                      // 如果 meterId 同时在 batId 和 failArr 中，设置 flag 为 0
                      return { ...item, flag: 0 };
                    } else {
                      // 如果 meterId 只在 batId 中，设置 flag 为 1
                      return { ...item, flag: 1 };
                    }
                  }
                  // 如果 meterId 不在 batId 中，保留原始项
                  return item;
                });

                // 输出更新后的数组
                console.log("this.rechargeTableData", this.rechargeTableData);
              }
              // end
              // this.$message.success(`操作成功!`)
              loading.close();
              this.search();
            } else {
              this.$message.info(`${res.msg}`);
            }
          });
        }
      }
      // 关闭勾选设备列表弹框
      this.BatchRechargeListShow = true;
    }
  }
};
</script>

<style lang="scss" scoped>
.deviceAll {
  width: 100%;
  padding-top: 15px;
  padding: 0 15px;
  height: calc(100vh - 100px);

  .content {
    width: 100%;
    display: flex;
    justify-content: space-around;
    height: 100%;

    .area {
      width: 15%;
      height: 100%;

      .el-tree {
        // background-color: pink;
        width: 100% !important;
        height: 100% !important;

        // overflow: scroll !important;
      }

      .el-tree > .el-tree-node {
        display: inline-block !important;
        min-width: 100% !important;
      }

      .el-card {
        // height: 100% !important;

        .el-card__body {
          .areaContent {
            height: 700px;
            overflow-y: auto;
          }
        }

        .custom-tree-node {
          text-align: left;
          width: calc(100% - 4px);

          white-space: nowrap;
          // text-overflow: ellipsis;
          min-width: auto;
          padding: 4px 26px 4px 2px;
          border-radius: 4px;
        }
      }
    }

    .device {
      width: 83%;
      height: 100%;

      .el-tabs {
        height: 100%;
        background: #fff;
        padding: 8px;

        /deep/ .el-tabs__content {
          height: 80%;

          .el-tab-pane {
            height: 90%;
          }
        }
      }
    }
  }

  .number {
    background: #f5f5fc;
    width: 100%;
    height: 15%;
    margin-bottom: 1%;
    display: flex;
    justify-content: space-around;
    align-items: center;

    .item {
      width: 17%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      height: 80%;
      background: #fff;
      border-radius: 20px;
    }
  }

  .search {
    margin-bottom: 1%;

    .el-input {
      width: 200px;
    }

    .el-button {
      margin-left: 15px;
    }
  }

  .el-form-item {
    .box {
      width: 100%;
      display: flex;
      justify-content: space-between;
      padding: 0 10px;
      flex-wrap: wrap;

      .item {
        cursor: pointer;
        width: 24%;
        background-color: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 30rpx;
        font-weight: bold;
        margin-bottom: 20rpx;
        border: 1px solid #5277ff;
        border-radius: 30px;
      }

      .select {
        background-color: #5277ff;
        color: #fff;
        border: 1px solid #fff;
      }

      .el-input {
        width: 40%;
        margin: 20px 0;
        color: #5277ff;
        border-radius: 30px;
      }
    }
  }

  .table {
    height: 100%;

    .el-table {
      height: 75%;
    }

    .el-pagination {
      text-align: center;
      // margin-top: 20px;
    }
  }

  .dialogDetail {
    .one {
      display: flex;

      .left {
        width: 50%;

        .title {
          padding: 5px 10px;
          border-left: 5px solid #278bff;
          color: #278bff;
        }

        .content_one {
          box-sizing: border-box;
          width: 100%;

          tr {
            width: 100%;
            display: flex;
            justify-content: space-between;
            margin: 30px 0;
            align-items: center;

            td {
              display: flex;
              align-items: center;
              width: 33.33%;

              .tdTitle {
                color: #a2abc7;
                margin-right: 10px;
              }

              .twoLineCls {
                text-overflow: -o-ellipsis-lastline;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                line-clamp: 1;
                -webkit-box-orient: vertical;
              }
            }
          }
        }
      }
    }
  }

  /deep/ .el-descriptions-item__cell {
    text-align: center;
  }

  /deep/ .el-dialog {
    border-radius: 30px;
    position: absolute;
    left: 50%;
    bottom: 50%;
    transform: translate(-50%, 50%);
  }
}
</style>
<style>
.el-tooltip__popper {
  max-width: 300px;
}

.twoLineCls {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
}
</style>
<style>

.dialogEqCode {

  .qrcode_content {
    .el-dialog__body  {
padding: 40px !important;
  }
    /* margin-left: 30px !important; */
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    /* flex-direction: column; */
    /* align-items: center; */
  }
}
